@opengeni/react 6.5.2-canary.41607687019001 → 6.7.0

package/dist/chunk-UI4HI5QK.js

@@ -1,918 +0,0 @@
-"use client";
-import {
-  Button
-} from "./chunk-7QQN3KNP.js";
-import {
-  containedPortal
-} from "./chunk-UD6AAZSC.js";
-import {
-  usePortalTokenStyle
-} from "./chunk-XEA5BCMA.js";
-import {
-  cn
-} from "./chunk-TXS65BB2.js";
-import {
-  useOpenGeniText
-} from "./chunk-TNUSPXPW.js";
-
-// src/lib/keyboard-targets.ts
-var TEXT_ENTRY = 'input, textarea, select, [contenteditable]:not([contenteditable="false"])';
-function isTextEntryTarget(target) {
-  if (!(target instanceof HTMLElement)) return false;
-  return target.isContentEditable || target.closest(TEXT_ENTRY) !== null;
-}
-function ownsArrowKeys(target) {
-  return isTextEntryTarget(target) || target instanceof HTMLElement && target.closest('[role="menu"], [role="listbox"], [role="grid"], [role="slider"]') !== null;
-}
-
-// src/components/zoom-pan-image.tsx
-import { MinusIcon, PlusIcon } from "lucide-react";
-import {
-  useCallback,
-  useEffect,
-  useLayoutEffect,
-  useMemo,
-  useRef,
-  useState
-} from "react";
-
-// src/lib/zoom-pan.ts
-var MAX_FIT_UPSCALE = 2;
-var MAX_ZOOM = 8;
-var FIT_PADDING = 16;
-var STEPS = [0.1, 0.25, 0.5, 0.75, 1, 1.25, 1.5, 2, 3, 4, 6, 8];
-var EPSILON = 5e-3;
-function fitScale(image, viewport, padding = FIT_PADDING) {
-  const width = Math.max(1, viewport.width - padding * 2);
-  const height = Math.max(1, viewport.height - padding * 2);
-  return Math.min(width / image.width, height / image.height, MAX_FIT_UPSCALE);
-}
-function minScale(image, viewport) {
-  return Math.min(fitScale(image, viewport), 1);
-}
-function clampAxis(offset, content, viewport) {
-  if (content <= viewport) return (viewport - content) / 2;
-  return Math.min(0, Math.max(viewport - content, offset));
-}
-function clampView(view, image, viewport) {
-  return {
-    ...view,
-    x: clampAxis(view.x, image.width * view.scale, viewport.width),
-    y: clampAxis(view.y, image.height * view.scale, viewport.height)
-  };
-}
-function fitView(image, viewport) {
-  return clampView({ scale: fitScale(image, viewport), x: 0, y: 0, fit: true }, image, viewport);
-}
-function zoomTo(view, scale, point, image, viewport) {
-  const fit = fitScale(image, viewport);
-  const next = Math.min(MAX_ZOOM, Math.max(minScale(image, viewport), scale));
-  if (Math.abs(next - fit) < EPSILON) return fitView(image, viewport);
-  const ratio = next / view.scale;
-  return clampView(
-    {
-      scale: next,
-      x: point.x - (point.x - view.x) * ratio,
-      y: point.y - (point.y - view.y) * ratio,
-      fit: false
-    },
-    image,
-    viewport
-  );
-}
-function stepScale(view, direction, image, viewport) {
-  const stops = [...STEPS, fitScale(image, viewport)].sort((a, b) => a - b);
-  if (direction > 0) return stops.find((stop) => stop > view.scale + EPSILON) ?? MAX_ZOOM;
-  return stops.reverse().find((stop) => stop < view.scale - EPSILON) ?? minScale(image, viewport);
-}
-function panBy(view, dx, dy, image, viewport) {
-  return clampView({ ...view, x: view.x + dx, y: view.y + dy }, image, viewport);
-}
-function pinchTo(view, from, to, image, viewport) {
-  const moved = panBy(
-    view,
-    to.middle.x - from.middle.x,
-    to.middle.y - from.middle.y,
-    image,
-    viewport
-  );
-  if (!(from.distance > 0) || !(to.distance > 0)) return moved;
-  return zoomTo(moved, moved.scale * (to.distance / from.distance), to.middle, image, viewport);
-}
-function canPan(view, image, viewport) {
-  return image.width * view.scale > viewport.width + 0.5 || image.height * view.scale > viewport.height + 0.5;
-}
-function toggleAt(view, point, image, viewport) {
-  if (!view.fit) return fitView(image, viewport);
-  const target = Math.abs(view.scale - 1) < EPSILON ? 2 : 1;
-  return zoomTo(view, target, point, image, viewport);
-}
-function clickZoomDirection(view, image, viewport) {
-  const next = toggleAt(view, { x: 0, y: 0 }, image, viewport);
-  return next.scale > view.scale + EPSILON ? "in" : "out";
-}
-function zoomPercent(view) {
-  return Math.round(view.scale * 100);
-}
-
-// src/components/zoom-pan-image.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-function validSize(size) {
-  return !!size && size.width > 0 && size.height > 0;
-}
-function settle(state) {
-  if (!validSize(state.image) || !validSize(state.viewport)) return { ...state, view: null };
-  if (!state.view || state.view.fit)
-    return { ...state, view: fitView(state.image, state.viewport) };
-  return { ...state, view: clampView(state.view, state.image, state.viewport) };
-}
-function useZoomPan(resetKey) {
-  const [stored, setStored] = useState({
-    key: resetKey,
-    image: null,
-    viewport: null,
-    view: null
-  });
-  const state = stored.key === resetKey ? stored : { key: resetKey, image: null, viewport: stored.viewport, view: null };
-  if (stored.key !== resetKey) setStored(state);
-  const key = useRef(resetKey);
-  key.current = resetKey;
-  const update = useCallback((change) => {
-    setStored(
-      (current) => change(
-        current.key === key.current ? current : { key: key.current, image: null, viewport: current.viewport, view: null }
-      )
-    );
-  }, []);
-  const move = useCallback(
-    (change) => update(
-      (current) => current.view && current.image && current.viewport ? { ...current, view: change(current.view, current.image, current.viewport) } : current
-    ),
-    [update]
-  );
-  const { image, viewport, view } = state;
-  return useMemo(() => {
-    const centre = (size) => size ? { x: size.width / 2, y: size.height / 2 } : { x: 0, y: 0 };
-    return {
-      view,
-      image,
-      viewport,
-      percent: view ? zoomPercent(view) : null,
-      canZoomIn: !!view && view.scale < MAX_ZOOM - 1e-3,
-      canZoomOut: !!view && !!image && !!viewport && view.scale > minScale(image, viewport) + 1e-3,
-      setImage: (size) => update(
-        (current) => validSize(size) && (current.image?.width !== size.width || current.image?.height !== size.height) ? settle({ ...current, image: size, view: null }) : current
-      ),
-      setViewport: (size) => update(
-        (current) => validSize(size) && (current.viewport?.width !== size.width || current.viewport?.height !== size.height) ? settle({ ...current, viewport: size }) : current
-      ),
-      zoomIn: (point) => move(
-        (current, img, port) => zoomTo(current, stepScale(current, 1, img, port), point ?? centre(port), img, port)
-      ),
-      zoomOut: (point) => move(
-        (current, img, port) => zoomTo(current, stepScale(current, -1, img, port), point ?? centre(port), img, port)
-      ),
-      zoomBy: (factor, point) => move((current, img, port) => zoomTo(current, current.scale * factor, point, img, port)),
-      pinch: (from, to) => move((current, img, port) => pinchTo(current, from, to, img, port)),
-      fit: () => move((_current, img, port) => fitView(img, port)),
-      toggleAt: (point) => move((current, img, port) => toggleAt(current, point, img, port)),
-      panBy: (dx, dy) => move((current, img, port) => panBy(current, dx, dy, img, port))
-    };
-  }, [image, viewport, view, update, move]);
-}
-function zoomShortcut(event) {
-  if (!(event.metaKey || event.ctrlKey) || event.altKey) return null;
-  switch (event.key) {
-    case "=":
-    case "+":
-      return "in";
-    case "-":
-    case "_":
-      return "out";
-    case "0":
-      return "fit";
-  }
-  switch (event.code) {
-    case "Equal":
-    case "NumpadAdd":
-      return "in";
-    case "Minus":
-    case "NumpadSubtract":
-      return "out";
-    case "Digit0":
-    case "Numpad0":
-      return "fit";
-  }
-  return null;
-}
-function useZoomPanShortcuts(controller, enabled) {
-  const latest = useRef(controller);
-  latest.current = controller;
-  useEffect(() => {
-    if (!enabled) return;
-    const onKeyDown = (event) => {
-      const action = zoomShortcut(event);
-      if (!action || isTextEntryTarget(event.target)) return;
-      event.preventDefault();
-      event.stopPropagation();
-      if (!latest.current.view) return;
-      if (action === "in") latest.current.zoomIn();
-      else if (action === "out") latest.current.zoomOut();
-      else latest.current.fit();
-    };
-    window.addEventListener("keydown", onKeyDown, { capture: true });
-    return () => window.removeEventListener("keydown", onKeyDown, { capture: true });
-  }, [enabled]);
-}
-var CLICK_SLOP = 4;
-function distance(a, b) {
-  return Math.hypot(a.x - b.x, a.y - b.y);
-}
-function middle(a, b) {
-  return { x: (a.x + b.x) / 2, y: (a.y + b.y) / 2 };
-}
-function wheelPixels(event, delta) {
-  return event.deltaMode === 1 ? delta * 16 : event.deltaMode === 2 ? delta * 400 : delta;
-}
-function ZoomPanSurface({
-  controller,
-  src,
-  alt,
-  naturalSize,
-  onBackdropClick,
-  onError,
-  className,
-  imageClassName
-}) {
-  const surface = useRef(null);
-  const img = useRef(null);
-  const latest = useRef(controller);
-  latest.current = controller;
-  const pointers = useRef(/* @__PURE__ */ new Map());
-  const gesture = useRef(null);
-  const [dragging, setDragging] = useState(false);
-  const { view, image, viewport } = controller;
-  const local = useCallback((event) => {
-    const rect = surface.current?.getBoundingClientRect();
-    return { x: event.clientX - (rect?.left ?? 0), y: event.clientY - (rect?.top ?? 0) };
-  }, []);
-  const knownWidth = naturalSize?.width ?? 0;
-  const knownHeight = naturalSize?.height ?? 0;
-  useLayoutEffect(() => {
-    if (knownWidth > 0 && knownHeight > 0)
-      latest.current.setImage({ width: knownWidth, height: knownHeight });
-  }, [knownWidth, knownHeight]);
-  useLayoutEffect(() => {
-    const element = surface.current;
-    if (!element) return;
-    const measure = () => {
-      const width = element.clientWidth;
-      const height = element.clientHeight;
-      if (width > 0 && height > 0) latest.current.setViewport({ width, height });
-    };
-    const loaded = img.current;
-    if (loaded?.complete && loaded.naturalWidth > 0 && loaded.naturalHeight > 0)
-      latest.current.setImage({ width: loaded.naturalWidth, height: loaded.naturalHeight });
-    measure();
-    if (typeof ResizeObserver === "undefined") return;
-    const observer = new ResizeObserver(measure);
-    observer.observe(element);
-    return () => observer.disconnect();
-  }, []);
-  useEffect(() => {
-    const element = surface.current;
-    if (!element) return;
-    const onWheel = (event) => {
-      const current = latest.current;
-      if (!current.view || !current.image || !current.viewport) return;
-      if (event.ctrlKey || event.metaKey) {
-        event.preventDefault();
-        const delta = Math.max(-60, Math.min(60, wheelPixels(event, event.deltaY)));
-        current.zoomBy(Math.exp(-delta * 6e-3), local(event));
-        return;
-      }
-      if (!canPan(current.view, current.image, current.viewport)) return;
-      event.preventDefault();
-      const dx = wheelPixels(event, event.shiftKey && !event.deltaX ? event.deltaY : event.deltaX);
-      const dy = event.shiftKey && !event.deltaX ? 0 : wheelPixels(event, event.deltaY);
-      current.panBy(-dx, -dy);
-    };
-    let gestureScale = 1;
-    const onGestureStart = (event) => {
-      event.preventDefault();
-      gestureScale = 1;
-    };
-    const onGestureChange = (event) => {
-      const scale = event.scale;
-      const point = event;
-      if (typeof scale !== "number" || scale <= 0) return;
-      event.preventDefault();
-      latest.current.zoomBy(
-        scale / gestureScale,
-        local({ clientX: point.clientX ?? 0, clientY: point.clientY ?? 0 })
-      );
-      gestureScale = scale;
-    };
-    element.addEventListener("wheel", onWheel, { passive: false });
-    element.addEventListener("gesturestart", onGestureStart, { passive: false });
-    element.addEventListener("gesturechange", onGestureChange, { passive: false });
-    return () => {
-      element.removeEventListener("wheel", onWheel);
-      element.removeEventListener("gesturestart", onGestureStart);
-      element.removeEventListener("gesturechange", onGestureChange);
-    };
-  }, [local]);
-  const insideImage = (point, client) => {
-    if (view && image)
-      return point.x >= view.x && point.y >= view.y && point.x <= view.x + image.width * view.scale && point.y <= view.y + image.height * view.scale;
-    const rect = img.current?.getBoundingClientRect();
-    return !!rect && rect.width > 0 && client.clientX >= rect.left && client.clientX <= rect.right && client.clientY >= rect.top && client.clientY <= rect.bottom;
-  };
-  const onPointerDown = (event) => {
-    if (event.pointerType === "mouse" && event.button !== 0) return;
-    try {
-      event.currentTarget.setPointerCapture(event.pointerId);
-    } catch {
-    }
-    const point = local(event);
-    pointers.current.set(event.pointerId, point);
-    const points = [...pointers.current.values()];
-    if (points.length === 1) gesture.current = { moved: false, start: point, pinch: null };
-    else if (points.length === 2 && gesture.current) {
-      gesture.current.moved = true;
-      gesture.current.pinch = {
-        distance: distance(points[0], points[1]),
-        middle: middle(points[0], points[1])
-      };
-    }
-  };
-  const onPointerMove = (event) => {
-    const previous = pointers.current.get(event.pointerId);
-    const current = gesture.current;
-    if (!previous || !current) return;
-    const point = local(event);
-    pointers.current.set(event.pointerId, point);
-    const points = [...pointers.current.values()];
-    if (points.length >= 2 && current.pinch) {
-      const next = {
-        distance: distance(points[0], points[1]),
-        middle: middle(points[0], points[1])
-      };
-      controller.pinch(current.pinch, next);
-      current.pinch = next;
-      return;
-    }
-    if (!current.moved && distance(point, current.start) > CLICK_SLOP) current.moved = true;
-    if (current.moved && view && image && viewport && canPan(view, image, viewport)) {
-      setDragging(true);
-      controller.panBy(point.x - previous.x, point.y - previous.y);
-    }
-  };
-  const onPointerEnd = (event) => {
-    if (!pointers.current.delete(event.pointerId)) return;
-    const current = gesture.current;
-    if (pointers.current.size > 0) {
-      if (current) current.pinch = null;
-      return;
-    }
-    gesture.current = null;
-    setDragging(false);
-    if (event.type !== "pointerup" || !current || current.moved) return;
-    const point = local(event);
-    if (!insideImage(point, event)) onBackdropClick?.();
-    else if (view) controller.toggleAt(point);
-  };
-  const pannable = !!view && !!image && !!viewport && canPan(view, image, viewport);
-  const clickZoom = view && image && viewport ? clickZoomDirection(view, image, viewport) : null;
-  const imageCursor = dragging ? "cursor-grabbing" : pannable ? "cursor-grab" : clickZoom === "in" ? "cursor-zoom-in" : clickZoom === "out" ? "cursor-zoom-out" : void 0;
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: surface,
-      "data-zoom-pan-surface": true,
-      role: "presentation",
-      onPointerDown,
-      onPointerMove,
-      onPointerUp: onPointerEnd,
-      onPointerCancel: onPointerEnd,
-      className: cn(
-        "absolute inset-0 touch-none overflow-hidden select-none",
-        dragging && "cursor-grabbing",
-        className
-      ),
-      children: /* @__PURE__ */ jsx(
-        "img",
-        {
-          ref: img,
-          src,
-          alt,
-          draggable: false,
-          "data-zoom-scale": view ? view.scale.toFixed(3) : void 0,
-          "data-zoom-click": clickZoom ?? void 0,
-          onLoad: (event) => {
-            const element = event.currentTarget;
-            if (element.naturalWidth > 0 && element.naturalHeight > 0)
-              controller.setImage({ width: element.naturalWidth, height: element.naturalHeight });
-          },
-          onError,
-          style: view && image ? {
-            position: "absolute",
-            left: 0,
-            top: 0,
-            width: image.width * view.scale,
-            height: image.height * view.scale,
-            maxWidth: "none",
-            maxHeight: "none",
-            // Whole pixels, so an image at actual size is never resampled.
-            transform: `translate3d(${Math.round(view.x)}px, ${Math.round(view.y)}px, 0)`,
-            // Past 2x, show the screenshot's own pixels crisply instead of blurring them.
-            imageRendering: view.scale >= 2 ? "pixelated" : void 0
-          } : void 0,
-          className: cn(
-            // The image takes the pointer only for its cursor; presses still reach
-            // the surface, which decides between zoom and backdrop by position.
-            "block [-webkit-touch-callout:none]",
-            imageCursor,
-            !view && "absolute inset-0 m-auto max-h-[calc(100%-2rem)] max-w-[calc(100%-2rem)]",
-            imageClassName
-          )
-        }
-      )
-    }
-  );
-}
-function shortcutModifier() {
-  if (typeof navigator === "undefined") return "Ctrl";
-  return /Mac|iPhone|iPad/u.test(navigator.platform) ? "\u2318" : "Ctrl";
-}
-function ZoomControls({
-  controller,
-  labels,
-  className,
-  buttonClassName
-}) {
-  const modifier = useMemo(shortcutModifier, []);
-  const t = useOpenGeniText();
-  const zoomOut = labels?.zoomOut ?? t("timeline.screenshotLightbox.zoomOut");
-  const zoomIn = labels?.zoomIn ?? t("timeline.screenshotLightbox.zoomIn");
-  const fit = labels?.fit ?? t("timeline.screenshotLightbox.fit");
-  const { view } = controller;
-  return /* @__PURE__ */ jsxs("div", { "data-zoom-controls": true, className: cn("flex shrink-0 items-center gap-0.5", className), children: [
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        type: "button",
-        variant: "ghost",
-        size: "icon-sm",
-        className: cn("pointer-coarse:size-11", buttonClassName),
-        "aria-label": zoomOut,
-        title: `${zoomOut} (${modifier}\u2212)`,
-        disabled: !controller.canZoomOut,
-        onClick: () => controller.zoomOut(),
-        children: /* @__PURE__ */ jsx(MinusIcon, { "aria-hidden": "true" })
-      }
-    ),
-    /* @__PURE__ */ jsx("span", { "data-zoom-percent": true, className: "min-w-11 text-center text-xs tabular-nums opacity-80", children: controller.percent === null ? "" : `${controller.percent}%` }),
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        type: "button",
-        variant: "ghost",
-        size: "icon-sm",
-        className: cn("pointer-coarse:size-11", buttonClassName),
-        "aria-label": zoomIn,
-        title: `${zoomIn} (${modifier}+)`,
-        disabled: !controller.canZoomIn,
-        onClick: () => controller.zoomIn(),
-        children: /* @__PURE__ */ jsx(PlusIcon, { "aria-hidden": "true" })
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        type: "button",
-        variant: "ghost",
-        size: "sm",
-        className: cn("h-8 px-2 text-xs pointer-coarse:h-11", buttonClassName),
-        title: `${fit} (${modifier}0)`,
-        disabled: !view || view.fit,
-        onClick: () => controller.fit(),
-        children: fit
-      }
-    )
-  ] });
-}
-
-// src/timeline/screenshot-lightbox.tsx
-import { ChevronLeftIcon, ChevronRightIcon, DownloadIcon, XIcon } from "lucide-react";
-import { AnimatePresence, motion } from "motion/react";
-import {
-  createContext,
-  useCallback as useCallback2,
-  useContext,
-  useEffect as useEffect2,
-  useMemo as useMemo2,
-  useRef as useRef2,
-  useState as useState2
-} from "react";
-import { Dialog } from "radix-ui";
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var DialogContainedPortal = containedPortal(Dialog.Portal);
-var LightboxContext = createContext(null);
-var LightboxGalleryContext = createContext(null);
-var GALLERY_ROOT_SELECTOR = "[data-og-timeline-scroller]";
-var LIGHTBOX_INTERACTIVE_SELECTOR = "a, button, [data-zoom-controls], [data-zoom-pan-surface]";
-function isLightboxBackdrop(target, content) {
-  return target instanceof Element && content.contains(target) && !target.closest(LIGHTBOX_INTERACTIVE_SELECTOR);
-}
-var NO_WINDOW_DRAG = "[-webkit-app-region:no-drag] [app-region:no-drag]";
-var ROUND_BUTTON = cn(
-  "inline-flex items-center justify-center rounded-full",
-  "border border-white/15 bg-black/60 text-white/70 backdrop-blur",
-  "transition-colors hover:border-white/30 hover:bg-white/15 hover:text-white",
-  "active:border-white/40 active:bg-white/25 active:text-white",
-  "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-white/50"
-);
-function useLightboxGalleryItem(ref, entry) {
-  const registry = useContext(LightboxGalleryContext);
-  const latest = useRef2(entry);
-  latest.current = entry;
-  const enabled = entry !== null;
-  useEffect2(() => {
-    const element = ref.current;
-    if (!registry || !element || !enabled) return;
-    return registry.register({
-      element,
-      entry: latest
-    });
-  }, [registry, ref, enabled]);
-}
-function useLightbox() {
-  return useContext(LightboxContext) ?? NOOP;
-}
-function useLightboxOptional() {
-  return useContext(LightboxContext);
-}
-var NOOP = { open: () => {
-} };
-function createLightboxSourceOwner() {
-  let releaseCurrent = null;
-  return {
-    replace(release) {
-      const previous = releaseCurrent;
-      releaseCurrent = release ?? null;
-      previous?.();
-    },
-    release() {
-      const release = releaseCurrent;
-      releaseCurrent = null;
-      release?.();
-    }
-  };
-}
-function LightboxProvider({ children }) {
-  const ancestor = useContext(LightboxContext);
-  if (ancestor) {
-    return /* @__PURE__ */ jsx2(Fragment, { children });
-  }
-  return /* @__PURE__ */ jsx2(LightboxRoot, { children });
-}
-function LightboxRoot({ children }) {
-  const t = useOpenGeniText();
-  const [state, setState] = useState2(null);
-  const [tokenSource, setTokenSource] = useState2(null);
-  const sourceOwner = useMemo2(() => createLightboxSourceOwner(), []);
-  const portalStyle = usePortalTokenStyle(tokenSource);
-  const entries = useRef2(/* @__PURE__ */ new Set());
-  const [gallery, setGallery] = useState2(null);
-  const generation = useRef2(0);
-  const pressedBackdrop = useRef2(false);
-  const zoom = useZoomPan(state?.src ?? "");
-  useZoomPanShortcuts(zoom, state !== null);
-  const registry = useMemo2(
-    () => ({
-      register(item) {
-        entries.current.add(item);
-        return () => {
-          entries.current.delete(item);
-        };
-      }
-    }),
-    []
-  );
-  const releaseCurrentSource = useCallback2(() => {
-    sourceOwner.release();
-  }, [sourceOwner]);
-  useEffect2(
-    () => () => {
-      generation.current++;
-      releaseCurrentSource();
-    },
-    [releaseCurrentSource]
-  );
-  const discoverGallery = useCallback2((source, token) => {
-    const root = source.closest(GALLERY_ROOT_SELECTOR) ?? source.ownerDocument.body;
-    const candidates = [...entries.current].filter((item) => item.element.isConnected && root.contains(item.element)).sort(
-      (a, b) => a.element.compareDocumentPosition(b.element) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1
-    );
-    const current = candidates.filter((item) => item.element.contains(source)).pop();
-    if (!current) return;
-    void Promise.all(
-      candidates.map(
-        (item) => item === current ? Promise.resolve(true) : (item.entry.current.isImage?.() ?? Promise.resolve(true)).catch(() => false)
-      )
-    ).then((images) => {
-      if (generation.current !== token) return;
-      const items = candidates.filter((_, index) => images[index]);
-      if (items.length > 1) setGallery({ items, index: items.indexOf(current) });
-    });
-  }, []);
-  const open = useCallback2(
-    (src, caption, source, label = t("timeline.screenshotLightbox.screenshot"), downloadFilename, controlLabels, releaseSource) => {
-      const token = ++generation.current;
-      sourceOwner.replace(releaseSource);
-      setTokenSource(source ?? null);
-      setGallery(null);
-      setState({
-        src,
-        label,
-        ...caption ? { caption } : {},
-        ...downloadFilename ? { downloadFilename } : {},
-        ...controlLabels ? { controlLabels } : {}
-      });
-      if (source) discoverGallery(source, token);
-    },
-    [sourceOwner, discoverGallery, t]
-  );
-  const close = useCallback2(() => {
-    generation.current++;
-    releaseCurrentSource();
-    setState(null);
-    setTokenSource(null);
-    setGallery(null);
-  }, [releaseCurrentSource]);
-  const step = useCallback2(
-    (delta) => {
-      if (!gallery) return;
-      const token = ++generation.current;
-      const count = gallery.items.length;
-      void (async () => {
-        for (let offset = 1; offset < count; offset++) {
-          const index = ((gallery.index + delta * offset) % count + count) % count;
-          const image = await gallery.items[index].entry.current.load().catch(() => null);
-          if (generation.current !== token) {
-            image?.release?.();
-            return;
-          }
-          if (!image) continue;
-          sourceOwner.replace(image.release);
-          setGallery({ items: gallery.items, index });
-          setState(
-            (previous) => previous ? {
-              src: image.src,
-              label: image.label ?? previous.label,
-              ...image.caption ? { caption: image.caption } : {},
-              ...previous.controlLabels ? { controlLabels: previous.controlLabels } : {}
-            } : previous
-          );
-          return;
-        }
-      })();
-    },
-    [gallery, sourceOwner]
-  );
-  const galleryOpen = state !== null && gallery !== null;
-  useEffect2(() => {
-    if (!galleryOpen) return;
-    const onKeyDown = (event) => {
-      if (event.defaultPrevented || event.altKey || event.ctrlKey || event.metaKey) return;
-      if (isTextEntryTarget(event.target)) return;
-      if (event.key === "ArrowLeft" || event.key === "ArrowRight") {
-        event.preventDefault();
-        step(event.key === "ArrowLeft" ? -1 : 1);
-      }
-    };
-    window.addEventListener("keydown", onKeyDown);
-    return () => window.removeEventListener("keydown", onKeyDown);
-  }, [galleryOpen, step]);
-  const controller = useMemo2(() => ({ open }), [open]);
-  return /* @__PURE__ */ jsxs2(LightboxContext.Provider, { value: controller, children: [
-    /* @__PURE__ */ jsx2(LightboxGalleryContext.Provider, { value: registry, children }),
-    /* @__PURE__ */ jsx2(Dialog.Root, { open: state !== null, onOpenChange: (next) => !next && close(), children: /* @__PURE__ */ jsx2(AnimatePresence, { children: state !== null ? /* @__PURE__ */ jsxs2(DialogContainedPortal, { forceMount: true, children: [
-      /* @__PURE__ */ jsx2(Dialog.Overlay, { asChild: true, forceMount: true, children: /* @__PURE__ */ jsx2(
-        motion.div,
-        {
-          initial: { opacity: 0 },
-          animate: { opacity: 1 },
-          exit: { opacity: 0 },
-          transition: { duration: 0.15 },
-          className: cn(
-            "og-root fixed inset-0 z-50 bg-black/90 backdrop-blur-md",
-            NO_WINDOW_DRAG
-          ),
-          style: portalStyle
-        }
-      ) }),
-      /* @__PURE__ */ jsx2(
-        Dialog.Content,
-        {
-          asChild: true,
-          forceMount: true,
-          "data-window-layer": true,
-          "aria-label": state.label,
-          onOpenAutoFocus: (event) => event.preventDefault(),
-          children: /* @__PURE__ */ jsxs2(
-            motion.div,
-            {
-              initial: { opacity: 0, scale: 0.98 },
-              animate: { opacity: 1, scale: 1 },
-              exit: { opacity: 0, scale: 0.98 },
-              transition: { duration: 0.18, ease: [0.16, 1, 0.3, 1] },
-              onPointerDown: (event) => {
-                pressedBackdrop.current = isLightboxBackdrop(event.target, event.currentTarget);
-              },
-              onClick: (event) => {
-                const pressed = pressedBackdrop.current;
-                pressedBackdrop.current = false;
-                const selection = event.currentTarget.ownerDocument.getSelection();
-                if (pressed && (!selection || selection.isCollapsed) && isLightboxBackdrop(event.target, event.currentTarget)) {
-                  close();
-                }
-              },
-              className: cn(
-                "og-root fixed inset-0 z-50 flex items-center justify-center p-6 sm:p-12",
-                NO_WINDOW_DRAG
-              ),
-              style: portalStyle,
-              children: [
-                /* @__PURE__ */ jsx2(Dialog.Title, { className: "sr-only", children: state.label }),
-                /* @__PURE__ */ jsx2(Dialog.Description, { className: "sr-only", children: state.caption ?? t("timeline.screenshotLightbox.expandedLowercase", {
-                  lowerCase: state.label.toLowerCase()
-                }) }),
-                gallery ? /* @__PURE__ */ jsx2(
-                  LightboxStepButton,
-                  {
-                    direction: "previous",
-                    label: state.controlLabels?.previous ?? t("timeline.screenshotLightbox.previousImage"),
-                    onClick: () => step(-1)
-                  }
-                ) : null,
-                /* @__PURE__ */ jsxs2(
-                  "figure",
-                  {
-                    className: cn(
-                      "m-0 flex size-full min-h-0 flex-col items-center gap-3",
-                      gallery && "px-12 sm:px-16"
-                    ),
-                    children: [
-                      /* @__PURE__ */ jsx2("div", { className: "relative min-h-0 w-full flex-1", children: /* @__PURE__ */ jsx2(
-                        ZoomPanSurface,
-                        {
-                          controller: zoom,
-                          src: state.src,
-                          alt: state.caption ?? state.label,
-                          onBackdropClick: close,
-                          imageClassName: "rounded-og-md border border-white/10 shadow-og-lg"
-                        }
-                      ) }),
-                      /* @__PURE__ */ jsx2(
-                        ZoomControls,
-                        {
-                          controller: zoom,
-                          labels: {
-                            zoomIn: state.controlLabels?.zoomIn ?? t("timeline.screenshotLightbox.zoomIn"),
-                            zoomOut: state.controlLabels?.zoomOut ?? t("timeline.screenshotLightbox.zoomOut"),
-                            fit: state.controlLabels?.fit ?? t("timeline.screenshotLightbox.fit")
-                          },
-                          className: "rounded-full border border-white/15 bg-black/60 px-1 text-white/70 backdrop-blur",
-                          buttonClassName: "rounded-full text-white/70 hover:bg-white/10 hover:text-white disabled:text-white/30"
-                        }
-                      ),
-                      gallery ? /* @__PURE__ */ jsxs2("figcaption", { className: "flex max-w-2xl flex-col items-center gap-1 text-center font-og-mono text-og-xs", children: [
-                        state.caption ? /* @__PURE__ */ jsx2("span", { className: "text-white/55", children: state.caption }) : null,
-                        /* @__PURE__ */ jsxs2("span", { className: "tabular-nums text-white/35", "aria-live": "polite", children: [
-                          gallery.index + 1,
-                          " ",
-                          t("timeline.screenshotLightbox.ofLength", {
-                            length: gallery.items.length
-                          })
-                        ] })
-                      ] }) : state.caption ? /* @__PURE__ */ jsx2("figcaption", { className: "max-w-2xl text-center font-og-mono text-og-xs text-white/55", children: state.caption }) : /* @__PURE__ */ jsx2("figcaption", { className: "font-og-mono text-og-xs uppercase tracking-[0.1em] text-white/35", children: t("timeline.screenshotLightbox.escOrClickOutsideTo") })
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsx2(
-                  ScreenshotLightboxControls,
-                  {
-                    src: state.src,
-                    downloadFilename: state.downloadFilename,
-                    controlLabels: state.controlLabels
-                  }
-                ),
-                gallery ? /* @__PURE__ */ jsx2(
-                  LightboxStepButton,
-                  {
-                    direction: "next",
-                    label: state.controlLabels?.next ?? t("timeline.screenshotLightbox.nextImage"),
-                    onClick: () => step(1)
-                  }
-                ) : null
-              ]
-            }
-          )
-        }
-      )
-    ] }) : null }) })
-  ] });
-}
-function LightboxStepButton({
-  direction,
-  label,
-  onClick
-}) {
-  const Icon = direction === "previous" ? ChevronLeftIcon : ChevronRightIcon;
-  return /* @__PURE__ */ jsx2(
-    "button",
-    {
-      type: "button",
-      onClick,
-      "aria-label": label,
-      className: cn(
-        ROUND_BUTTON,
-        "absolute top-1/2 z-10 size-11 -translate-y-1/2",
-        direction === "previous" ? "left-3 sm:left-6" : "right-3 sm:right-6"
-      ),
-      children: /* @__PURE__ */ jsx2(Icon, { className: "size-5" })
-    }
-  );
-}
-function ScreenshotLightboxControls({
-  src,
-  downloadFilename,
-  controlLabels
-}) {
-  const t = useOpenGeniText();
-  return /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      "data-lightbox-controls": true,
-      className: "absolute right-3 top-3 z-10 flex items-center gap-2 sm:right-6 sm:top-6",
-      children: [
-        downloadFilename ? /* @__PURE__ */ jsx2(
-          "a",
-          {
-            href: src,
-            download: downloadFilename,
-            className: cn(ROUND_BUTTON, "size-9"),
-            "aria-label": controlLabels?.download ?? t("timeline.screenshotLightbox.downloadDownloadfilename", { downloadFilename }),
-            children: /* @__PURE__ */ jsx2(DownloadIcon, { className: "size-4" })
-          }
-        ) : null,
-        /* @__PURE__ */ jsx2(
-          Dialog.Close,
-          {
-            className: cn(ROUND_BUTTON, "size-9"),
-            "aria-label": controlLabels?.close ?? t("timeline.screenshotLightbox.close"),
-            children: /* @__PURE__ */ jsx2(XIcon, { className: "size-4" })
-          }
-        )
-      ]
-    }
-  );
-}
-
-// src/timeline/shimmer-text.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function ShimmerText({
-  active = true,
-  tone = "text",
-  className,
-  children
-}) {
-  return /* @__PURE__ */ jsxs3(
-    "span",
-    {
-      className: cn("og-shimmer", className),
-      "data-og-shimmer": active === false ? void 0 : active === true ? "on" : "ancestor",
-      "data-og-shimmer-tone": tone,
-      children: [
-        children,
-        active === false ? null : typeof children === "string" ? /* @__PURE__ */ jsx3("span", { className: "og-shimmer-beam", "aria-hidden": "true", "data-og-shimmer-copy": children }) : /* @__PURE__ */ jsx3("span", { className: "og-shimmer-beam", "aria-hidden": "true", children: /* @__PURE__ */ jsx3("span", { className: cn("og-shimmer-copy", className), children }) })
-      ]
-    }
-  );
-}
-
-export {
-  ownsArrowKeys,
-  useZoomPan,
-  useZoomPanShortcuts,
-  ZoomPanSurface,
-  ZoomControls,
-  useLightboxGalleryItem,
-  useLightbox,
-  useLightboxOptional,
-  LightboxProvider,
-  ShimmerText
-};
-//# sourceMappingURL=chunk-UI4HI5QK.js.map