@opengeni/react 6.5.2-canary.41607687019001 → 6.7.0

package/dist/timeline-annotations-dialog-Y4XD3N7B.js

@@ -1,283 +0,0 @@
-"use client";
-import {
-  AnnotationAccentRow,
-  AnnotationNoteField,
-  AnnotationNotePreview,
-  AnnotationQuoteSourceButton
-} from "./chunk-KRPLAAFP.js";
-import {
-  ANNOTATION_REVIEW_DIALOG_WIDTH_PX,
-  clampAnnotationDialogPlacement,
-  scrollAnnotationRowIntoList
-} from "./chunk-LJUMYUBO.js";
-import {
-  cssEscapeAttribute
-} from "./chunk-5XXRHX3V.js";
-import {
-  annotationDisplayOrdinal
-} from "./chunk-UNI2IXRC.js";
-import {
-  usePortalContainer
-} from "./chunk-UD6AAZSC.js";
-import {
-  usePortalTokenStyle
-} from "./chunk-XEA5BCMA.js";
-import "./chunk-TXS65BB2.js";
-import {
-  useOpenGeniText
-} from "./chunk-TNUSPXPW.js";
-
-// src/components/timeline-annotations-dialog.tsx
-import { XIcon } from "lucide-react";
-import { useEffect, useLayoutEffect, useRef, useState } from "react";
-import { createPortal } from "react-dom";
-import { jsx, jsxs } from "react/jsx-runtime";
-function focusableElements(root) {
-  return [
-    ...root.querySelectorAll(
-      'button:not([disabled]),textarea:not([disabled]),input:not([disabled]),[href],[tabindex]:not([tabindex="-1"])'
-    )
-  ].filter((element) => element.tabIndex >= 0 && !element.closest("[inert]"));
-}
-function TimelineAnnotationsDialog({
-  annotations,
-  editable,
-  focusAnnotationId,
-  onFocusConsumed,
-  onUpdate,
-  onRemove,
-  onRevealSource,
-  triggerRef,
-  countLabel,
-  onDismiss,
-  onCommit
-}) {
-  const t = useOpenGeniText();
-  const [unavailableId, setUnavailableId] = useState(null);
-  const [position, setPosition] = useState({ left: 12, top: 12, maxHeight: 0 });
-  const panelRef = useRef(null);
-  const headerRef = useRef(null);
-  const listRef = useRef(null);
-  const noteRefs = useRef(/* @__PURE__ */ new Map());
-  const focusedAnnotationIdRef = useRef(null);
-  const portalContainer = usePortalContainer();
-  const portalStyle = usePortalTokenStyle(triggerRef.current);
-  const revealNote = (id) => {
-    const row = listRef.current?.querySelector(
-      `[data-og-annotation-id="${cssEscapeAttribute(id)}"]`
-    );
-    scrollAnnotationRowIntoList(listRef.current, row);
-    noteRefs.current.get(id)?.focus();
-  };
-  const commitNotes = (fromId) => {
-    const incomplete = annotations.filter((annotation) => {
-      const live = noteRefs.current.get(annotation.id);
-      return (live?.value ?? annotation.note).trim().length === 0;
-    });
-    if (incomplete.length === 0) {
-      onCommit();
-      return;
-    }
-    const fromIndex = annotations.findIndex((annotation) => annotation.id === fromId);
-    const next = incomplete.find(
-      (item) => annotations.findIndex((annotation) => annotation.id === item.id) > fromIndex
-    ) ?? incomplete[0];
-    revealNote(next.id);
-  };
-  useLayoutEffect(() => {
-    const updatePosition = () => {
-      const rect = triggerRef.current?.getBoundingClientRect();
-      if (!rect) return;
-      const contentHeight = (headerRef.current?.offsetHeight ?? 44) + (listRef.current?.scrollHeight ?? 200);
-      setPosition(
-        clampAnnotationDialogPlacement({
-          triggerLeft: rect.left,
-          triggerTop: rect.top,
-          triggerBottom: rect.bottom,
-          contentHeight,
-          viewportWidth: window.innerWidth,
-          viewportHeight: window.innerHeight,
-          panelWidth: ANNOTATION_REVIEW_DIALOG_WIDTH_PX
-        })
-      );
-    };
-    updatePosition();
-    window.addEventListener("resize", updatePosition);
-    window.addEventListener("scroll", updatePosition, true);
-    return () => {
-      window.removeEventListener("resize", updatePosition);
-      window.removeEventListener("scroll", updatePosition, true);
-    };
-  }, [annotations, triggerRef]);
-  useLayoutEffect(() => {
-    if (!focusAnnotationId) {
-      focusedAnnotationIdRef.current = null;
-      return;
-    }
-    if (focusedAnnotationIdRef.current === focusAnnotationId) return;
-    focusedAnnotationIdRef.current = null;
-    if (position.maxHeight <= 0) return;
-    revealNote(focusAnnotationId);
-    const note = noteRefs.current.get(focusAnnotationId);
-    if (note && document.activeElement === note) {
-      focusedAnnotationIdRef.current = focusAnnotationId;
-      onFocusConsumed?.();
-    }
-  }, [focusAnnotationId, onFocusConsumed, annotations.length, position.maxHeight]);
-  useEffect(() => {
-    const onKeyDown = (event) => {
-      if (event.key === "Escape") {
-        event.stopPropagation();
-        onDismiss(true);
-        return;
-      }
-      if (event.key !== "Tab" || !panelRef.current) return;
-      const focusable = focusableElements(panelRef.current);
-      if (focusable.length === 0) return;
-      const first = focusable[0];
-      const last = focusable[focusable.length - 1];
-      if (event.shiftKey && document.activeElement === first) {
-        event.preventDefault();
-        last.focus();
-      } else if (!event.shiftKey && document.activeElement === last) {
-        event.preventDefault();
-        first.focus();
-      }
-    };
-    const onPointerDown = (event) => {
-      if (!(event.target instanceof Node)) return;
-      if (panelRef.current?.contains(event.target) || triggerRef.current?.contains(event.target)) {
-        return;
-      }
-      onDismiss(false);
-    };
-    document.addEventListener("keydown", onKeyDown);
-    document.addEventListener("pointerdown", onPointerDown);
-    if (!focusAnnotationId) {
-      window.setTimeout(() => {
-        if (document.activeElement === triggerRef.current) panelRef.current?.focus();
-      }, 0);
-    }
-    return () => {
-      document.removeEventListener("keydown", onKeyDown);
-      document.removeEventListener("pointerdown", onPointerDown);
-    };
-  }, [focusAnnotationId, onDismiss, triggerRef]);
-  if (typeof document === "undefined") return null;
-  return createPortal(
-    /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref: panelRef,
-        role: "dialog",
-        tabIndex: -1,
-        "data-og-annotation-review": "",
-        style: {
-          left: position.left,
-          top: position.top,
-          maxHeight: position.maxHeight,
-          ...portalStyle
-        },
-        className: "og-root fixed z-[75] box-border flex w-[min(25rem,calc(100vw-1.5rem))] flex-col overflow-hidden rounded-og-lg border border-og-border bg-og-surface-1 text-og-fg shadow-xl outline-hidden",
-        "aria-label": editable ? t("timelineAnnotationsDialog.editQuotedNotes") : t("timelineAnnotationsDialog.quotedNotes"),
-        children: [
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              ref: headerRef,
-              "data-og-annotation-review-header": "",
-              className: "flex shrink-0 items-start justify-between gap-3 px-3 pt-3 pb-2",
-              children: [
-                /* @__PURE__ */ jsx("p", { className: "min-w-0 pt-0.5 text-og-sm font-medium text-og-fg-muted", children: countLabel }),
-                /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    className: "inline-flex size-8 shrink-0 items-center justify-center rounded-md border-0 bg-transparent text-og-fg-muted outline-hidden hover:bg-og-surface-2 hover:text-og-fg focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:size-11",
-                    "aria-label": t("timelineAnnotationsDialog.close"),
-                    onClick: () => onDismiss(true),
-                    children: /* @__PURE__ */ jsx(XIcon, { className: "size-3.5", "aria-hidden": "true" })
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              ref: listRef,
-              "data-og-annotation-review-list": "",
-              className: "grid min-h-0 flex-1 gap-2.5 overflow-x-hidden overflow-y-auto overscroll-contain px-3 pb-3",
-              children: annotations.map((annotation, index) => {
-                const ordinal = annotationDisplayOrdinal(annotation, index);
-                return /* @__PURE__ */ jsx(
-                  "section",
-                  {
-                    "data-og-annotation-id": annotation.id,
-                    "aria-label": t("timelineAnnotationsDialog.annotationOrdinal", { ordinal }),
-                    children: /* @__PURE__ */ jsxs(AnnotationAccentRow, { children: [
-                      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-1", children: [
-                        /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
-                          /* @__PURE__ */ jsx("p", { className: "mb-0.5 text-og-xs font-medium tabular-nums text-og-fg-subtle", children: t("timelineAnnotationsDialog.annotationOrdinal", { ordinal }) }),
-                          /* @__PURE__ */ jsx(
-                            AnnotationQuoteSourceButton,
-                            {
-                              annotation,
-                              lines: 2,
-                              onRevealSource,
-                              onUnavailable: setUnavailableId
-                            }
-                          )
-                        ] }),
-                        editable && onRemove ? /* @__PURE__ */ jsx(
-                          "button",
-                          {
-                            type: "button",
-                            className: "inline-flex size-7 shrink-0 items-center justify-center rounded-md border-0 bg-transparent text-og-fg-subtle outline-hidden hover:bg-og-surface-1 hover:text-og-status-failed focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:size-11",
-                            "aria-label": t("timelineAnnotationsDialog.removeAnnotationOrdinal", {
-                              ordinal
-                            }),
-                            onClick: () => onRemove(annotation.id),
-                            children: /* @__PURE__ */ jsx(XIcon, { className: "size-3.5", "aria-hidden": "true" })
-                          }
-                        ) : null
-                      ] }),
-                      unavailableId === annotation.id ? /* @__PURE__ */ jsx("p", { role: "status", className: "text-og-xs text-og-status-waiting", children: t("timelineAnnotationsDialog.sourceIsOutsideTheLoaded") }) : null,
-                      editable && onUpdate ? /* @__PURE__ */ jsx(
-                        AnnotationNoteField,
-                        {
-                          annotation,
-                          inputRef: (node) => {
-                            if (node) noteRefs.current.set(annotation.id, node);
-                            else noteRefs.current.delete(annotation.id);
-                          },
-                          onUpdate,
-                          onCommit: () => commitNotes(annotation.id)
-                        }
-                      ) : /* @__PURE__ */ jsx(
-                        AnnotationNotePreview,
-                        {
-                          note: annotation.note,
-                          annotationId: annotation.id,
-                          ordinal
-                        }
-                      )
-                    ] })
-                  },
-                  annotation.id
-                );
-              })
-            }
-          )
-        ]
-      }
-    ),
-    portalContainer ?? document.body
-  );
-}
-var timeline_annotations_dialog_default = TimelineAnnotationsDialog;
-export {
-  TimelineAnnotationsDialog,
-  timeline_annotations_dialog_default as default
-};
-//# sourceMappingURL=timeline-annotations-dialog-Y4XD3N7B.js.map