wendang-react 0.6.3 → 0.6.5

package/dist/chunks/mind-topic-text-DSyb95vL.js

@@ -1,446 +0,0 @@
-"use client";
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { useState, useRef, useEffect, Fragment as Fragment$1 } from "react";
-import { w as whenNearViewport, e as ensureKatexCss, r as renderMathAsync } from "./katex-WjrodtTU.js";
-import { a as useContentContext, b as useContentHost, f as formatBytes, c as attachmentObjectUrl, u as unavailableAttachment, d as downloadAttachment } from "./host-C-V688Rq.js";
-import { safeHref, documentColorAttributes } from "wendang/shared";
-import { normalizeVideoEmbed, videoSourceUrl, VIDEO_PROVIDER_LABELS, videoPlayerUrl } from "wendang/internal/video-embed";
-import { createPortal } from "react-dom";
-import { l as lockScroll, t as trapTab } from "./index-DdfMnva8.js";
-import { setMindTextMeasureFactory, MIND_TOPIC_FONT } from "wendang/internal/mind-topic-text";
-const ROW_SELECTOR = ".ywiki-image-gallery, .doc-image-gallery";
-function previewItemsFrom(image, fallbackLabel = "图片预览") {
-  const toItem = (img) => ({
-    src: img.getAttribute("src") ?? "",
-    label: img.getAttribute("alt") || fallbackLabel
-  });
-  const lonely = () => {
-    if (!(image instanceof HTMLImageElement)) return { items: [], index: 0 };
-    const src = image.getAttribute("src");
-    return src ? { items: [{ src, label: image.getAttribute("alt") || fallbackLabel }], index: 0 } : { items: [], index: 0 };
-  };
-  if (!image || typeof image.closest !== "function") return { items: [], index: 0 };
-  const row = image.closest(ROW_SELECTOR);
-  if (!row) return lonely();
-  const images = Array.from(row.querySelectorAll("img")).filter(
-    (el) => el instanceof HTMLImageElement && !!el.getAttribute("src")
-  );
-  if (images.length === 0) return { items: [], index: 0 };
-  const found = images.indexOf(image);
-  if (found < 0) return lonely();
-  return { items: images.map(toItem), index: found };
-}
-function stepPreviewIndex(index, length, delta) {
-  if (!Number.isFinite(index) || length <= 0) return 0;
-  const next = index + (Number.isFinite(delta) ? delta : 0);
-  return Math.max(0, Math.min(length - 1, Math.round(next)));
-}
-function canStepPreview(index, length, delta) {
-  if (length <= 1) return false;
-  return stepPreviewIndex(index, length, delta) !== stepPreviewIndex(index, length, 0);
-}
-function ImagePreview({ src, label = "图片预览", items, index = 0, onClose }) {
-  const { portal } = useContentContext();
-  const [current, setCurrent] = useState(index), [scale, setScale] = useState(1), [rotation, setRotation] = useState(0);
-  const [offset, setOffset] = useState({ x: 0, y: 0 }), [dragging, setDragging] = useState(false);
-  const mask = useRef(null), panel = useRef(null);
-  const drag = useRef(null), closeRef = useRef(onClose);
-  closeRef.current = onClose;
-  const list = (items == null ? void 0 : items.length) ? items : [{ src, label }], listRef = useRef(list);
-  listRef.current = list;
-  const currentRef = useRef(current);
-  currentRef.current = current;
-  const active = list[current] ?? list[0];
-  function reset() {
-    setScale(1);
-    setRotation(0);
-    setOffset({ x: 0, y: 0 });
-  }
-  function zoomBy(factor) {
-    setScale((value) => Math.min(8, Math.max(0.25, value * factor)));
-  }
-  function step(delta) {
-    const next = stepPreviewIndex(currentRef.current, listRef.current.length, delta);
-    if (next !== currentRef.current) {
-      currentRef.current = next;
-      setCurrent(next);
-      reset();
-    }
-  }
-  useEffect(() => {
-    currentRef.current = index;
-    setCurrent(index);
-    reset();
-  }, [src, index]);
-  useEffect(() => {
-    if (!portal) return;
-    const previous = document.activeElement, scroll = lockScroll();
-    const keydown = (event) => {
-      if (event.isComposing) return;
-      if (event.key === "Escape") {
-        event.preventDefault();
-        event.stopPropagation();
-        closeRef.current();
-      } else if (event.key === "ArrowLeft") {
-        event.preventDefault();
-        step(-1);
-      } else if (event.key === "ArrowRight") {
-        event.preventDefault();
-        step(1);
-      } else if (event.key === "+" || event.key === "=") {
-        event.preventDefault();
-        zoomBy(1.2);
-      } else if (event.key === "-" || event.key === "_") {
-        event.preventDefault();
-        zoomBy(1 / 1.2);
-      } else if (event.key === "0") {
-        event.preventDefault();
-        reset();
-      } else if (mask.current && trapTab(mask.current, event)) event.preventDefault();
-    };
-    window.addEventListener("keydown", keydown, true);
-    const frame = requestAnimationFrame(() => {
-      var _a;
-      return (_a = panel.current) == null ? void 0 : _a.focus();
-    });
-    return () => {
-      cancelAnimationFrame(frame);
-      window.removeEventListener("keydown", keydown, true);
-      scroll.release();
-      if (previous == null ? void 0 : previous.isConnected) previous.focus();
-    };
-  }, [portal]);
-  useEffect(() => {
-    const node = mask.current;
-    if (!node) return;
-    const wheel = (event) => {
-      event.preventDefault();
-      zoomBy(event.deltaY < 0 ? 1.12 : 1 / 1.12);
-    };
-    node.addEventListener("wheel", wheel, { passive: false });
-    return () => node.removeEventListener("wheel", wheel);
-  }, [portal]);
-  function endDrag() {
-    drag.current = null;
-    setDragging(false);
-  }
-  if (!portal) return null;
-  return createPortal(/* @__PURE__ */ jsxs("div", { ref: mask, className: "img-preview-mask", onMouseDown: (event) => {
-    if (drag.current || !(event.target instanceof Element) || event.target.closest(".img-preview-image,.img-preview-toolbar,.img-preview-nav")) return;
-    closeRef.current();
-  }, children: [
-    /* @__PURE__ */ jsx("div", { ref: panel, className: "img-preview-stage", role: "dialog", "aria-modal": "true", "aria-label": active.label, tabIndex: -1, children: /* @__PURE__ */ jsx(
-      "img",
-      {
-        className: `img-preview-image${dragging ? " is-dragging" : ""}`,
-        src: active.src,
-        alt: active.label,
-        draggable: false,
-        style: { transform: `translate(${offset.x}px, ${offset.y}px) scale(${scale}) rotate(${rotation}deg)` },
-        onPointerDown: (event) => {
-          var _a, _b;
-          if (event.button !== 0) return;
-          drag.current = { x: event.clientX, y: event.clientY, ox: offset.x, oy: offset.y };
-          setDragging(true);
-          (_b = (_a = event.currentTarget).setPointerCapture) == null ? void 0 : _b.call(_a, event.pointerId);
-        },
-        onPointerMove: (event) => {
-          const origin = drag.current;
-          if (origin) setOffset({ x: origin.ox + event.clientX - origin.x, y: origin.oy + event.clientY - origin.y });
-        },
-        onPointerUp: endDrag,
-        onPointerCancel: endDrag,
-        onLostPointerCapture: endDrag
-      }
-    ) }),
-    list.length > 1 && /* @__PURE__ */ jsxs("div", { className: "img-preview-nav", role: "group", "aria-label": "图片翻页", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: "img-preview-nav-btn is-prev",
-          "aria-label": "上一张",
-          title: "上一张（←）",
-          disabled: !canStepPreview(current, list.length, -1),
-          onClick: () => step(-1),
-          children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "22", height: "22", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" }) })
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: "img-preview-nav-btn is-next",
-          "aria-label": "下一张",
-          title: "下一张（→）",
-          disabled: !canStepPreview(current, list.length, 1),
-          onClick: () => step(1),
-          children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "22", height: "22", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" }) })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "img-preview-toolbar", role: "toolbar", "aria-label": "图片预览操作", children: [
-      /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "缩小", title: "缩小（-）", onClick: () => zoomBy(1 / 1.2), children: "−" }),
-      /* @__PURE__ */ jsxs("span", { className: "img-preview-scale", "aria-live": "polite", children: [
-        Math.round(scale * 100),
-        "%"
-      ] }),
-      /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "放大", title: "放大（+）", onClick: () => zoomBy(1.2), children: "＋" }),
-      /* @__PURE__ */ jsx("span", { className: "img-preview-divider" }),
-      /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "向左旋转", title: "向左旋转", onClick: () => setRotation((value) => value - 90), children: "↺" }),
-      /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "向右旋转", title: "向右旋转", onClick: () => setRotation((value) => value + 90), children: "↻" }),
-      /* @__PURE__ */ jsx("span", { className: "img-preview-divider" }),
-      /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "还原", title: "还原（0）", onClick: reset, children: "还原" }),
-      list.length > 1 && /* @__PURE__ */ jsxs("span", { className: "img-preview-count", "aria-live": "polite", children: [
-        current + 1,
-        " / ",
-        list.length
-      ] }),
-      /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "关闭预览", title: "关闭（Esc）", onClick: onClose, children: "关闭" })
-    ] })
-  ] }), portal);
-}
-function AttachmentImage({ id, alt = "", width, fetcher, src, align, aspectRatio, galleryScale, className = "" }) {
-  var _a;
-  const host = useContentHost(), element = useRef(null);
-  const [result, setResult] = useState({ id: "", url: "", failed: false });
-  const [preview, setPreview] = useState(null);
-  useEffect(() => {
-    setResult({ id: id ?? "", url: "", failed: false });
-    const node = element.current;
-    if (!id || !node) return;
-    let alive = true, release;
-    const stop = whenNearViewport(node, () => {
-      var _a2;
-      release = attachmentObjectUrl(
-        id,
-        (url) => {
-          if (alive) setResult({ id, url, failed: false });
-        },
-        fetcher ?? ((_a2 = host.attachments) == null ? void 0 : _a2.fetch) ?? unavailableAttachment,
-        () => {
-          if (alive) setResult({ id, url: "", failed: true });
-        },
-        host.scope
-      );
-    });
-    return () => {
-      alive = false;
-      stop();
-      release == null ? void 0 : release();
-    };
-  }, [id, fetcher, (_a = host.attachments) == null ? void 0 : _a.fetch, host.scope]);
-  const source = id ? result.id === id ? result.url : "" : safeHref(src);
-  const failed = result.id === (id ?? "") && result.failed;
-  const transparent = "data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%221%22 height=%221%22 preserveAspectRatio=%22none%22%3E%3C/svg%3E";
-  function open(image) {
-    if (source && !failed) setPreview(previewItemsFrom(image, alt || "图片预览"));
-  }
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      "img",
-      {
-        ref: element,
-        className: `doc-image${className ? ` ${className}` : ""}`,
-        "data-attachment-id": id,
-        src: source || (failed ? transparent : void 0),
-        alt: source ? alt : void 0,
-        title: failed ? alt : void 0,
-        "data-sized": width ? "true" : void 0,
-        "data-align": align ?? void 0,
-        "data-aspect-ratio": aspectRatio && aspectRatio > 0 ? aspectRatio : void 0,
-        "data-gallery-scale": galleryScale && galleryScale !== 1 ? galleryScale : void 0,
-        "data-loading": !source && !failed ? "true" : void 0,
-        "data-image-error": failed ? "true" : void 0,
-        style: {
-          ...width ? { width: `${width}px` } : {},
-          ...aspectRatio && aspectRatio > 0 ? { "--doc-image-aspect-ratio": String(aspectRatio) } : {},
-          ...galleryScale && galleryScale > 0 && galleryScale !== 1 ? { "--doc-image-weight": String(galleryScale) } : {}
-        },
-        tabIndex: 0,
-        onError: () => setResult((previous) => ({ ...previous, failed: true })),
-        onClick: (event) => open(event.currentTarget),
-        onKeyDown: (event) => {
-          if (event.key === "Enter") open(event.currentTarget);
-        }
-      }
-    ),
-    preview && /* @__PURE__ */ jsx(ImagePreview, { src: source, label: alt || "图片预览", items: preview.items, index: preview.index, onClose: () => setPreview(null) })
-  ] });
-}
-function MathView({ latex, block = false }) {
-  const [result, setResult] = useState({ html: "", error: null });
-  useEffect(() => {
-    let active = true;
-    void ensureKatexCss();
-    void renderMathAsync(latex, block).then((value) => {
-      if (active) setResult(value);
-    });
-    return () => {
-      active = false;
-    };
-  }, [latex, block]);
-  return result.html ? /* @__PURE__ */ jsx("span", { className: block ? "doc-math-block" : "doc-math-inline", dangerouslySetInnerHTML: { __html: result.html } }) : /* @__PURE__ */ jsx("span", { role: result.error ? "alert" : void 0, children: result.error ? `公式错误：${latex}` : latex });
-}
-function FileVideo({ id, mimeType, fetcher }) {
-  var _a;
-  const host = useContentHost(), root = useRef(null), [state, setState] = useState({ id: "", url: "", failed: false });
-  useEffect(() => {
-    setState({ id, url: "", failed: false });
-    if (!root.current || !id) return;
-    let active = true, release;
-    const stop = whenNearViewport(root.current, () => {
-      var _a2;
-      release = attachmentObjectUrl(
-        id,
-        (url2) => {
-          if (active) setState({ id, url: url2, failed: false });
-        },
-        fetcher ?? ((_a2 = host.attachments) == null ? void 0 : _a2.fetch) ?? unavailableAttachment,
-        () => {
-          if (active) setState({ id, url: "", failed: true });
-        },
-        host.scope
-      );
-    });
-    return () => {
-      active = false;
-      stop();
-      release == null ? void 0 : release();
-    };
-  }, [id, fetcher, (_a = host.attachments) == null ? void 0 : _a.fetch, host.scope]);
-  const url = state.id === id ? state.url : "", failed = state.id === id && state.failed;
-  return /* @__PURE__ */ jsx("div", { ref: root, className: "doc-file-video", children: url && !failed ? /* @__PURE__ */ jsx("video", { src: url, controls: true, preload: "metadata", onError: () => setState((value) => ({ ...value, failed: true })), children: /* @__PURE__ */ jsx("source", { src: url, type: mimeType }) }) : /* @__PURE__ */ jsx("p", { className: "doc-file-video-fallback", children: failed ? "视频加载失败。" : "视频加载中…" }) });
-}
-function FileView({ id, filename, mimeType = "", size = 0, fetcher, allowExport = false }) {
-  const host = useContentHost(), [failure, setFailure] = useState(""), [busy, setBusy] = useState(false), allowed = useRef(allowExport), alive = useRef(true);
-  allowed.current = allowExport;
-  useEffect(() => {
-    alive.current = true;
-    return () => {
-      alive.current = false;
-    };
-  }, []);
-  useEffect(() => {
-    setFailure("");
-  }, [id]);
-  async function download() {
-    if (busy || !allowed.current) return;
-    setBusy(true);
-    setFailure("");
-    try {
-      await downloadAttachment(id, filename, async (value) => {
-        var _a;
-        const blob = await (fetcher ?? ((_a = host.attachments) == null ? void 0 : _a.fetch) ?? unavailableAttachment)(value);
-        if (!alive.current || !allowed.current) throw new Error("当前不允许导出附件");
-        return blob;
-      });
-    } catch (error) {
-      if (alive.current) setFailure(error instanceof Error ? error.message : "附件下载失败");
-    } finally {
-      if (alive.current) setBusy(false);
-    }
-  }
-  if (!id) return /* @__PURE__ */ jsx("div", { className: "doc-file is-missing", children: "［附件缺失］" });
-  return /* @__PURE__ */ jsxs("div", { className: "doc-file", children: [
-    /* @__PURE__ */ jsxs("div", { className: "doc-file-head", children: [
-      /* @__PURE__ */ jsx("span", { className: "doc-file-icon", children: mimeType.startsWith("video/") ? "▶" : mimeType.startsWith("image/") ? "🖼" : "📎" }),
-      /* @__PURE__ */ jsx("span", { className: "doc-file-name", title: filename, children: filename }),
-      /* @__PURE__ */ jsx("span", { className: "doc-file-size", children: formatBytes(size) }),
-      allowExport && /* @__PURE__ */ jsx("button", { type: "button", className: "doc-file-action", disabled: busy, onClick: () => void download(), children: busy ? "下载中…" : "下载" })
-    ] }),
-    mimeType.startsWith("video/") ? /* @__PURE__ */ jsx(FileVideo, { id, mimeType, fetcher }) : mimeType.startsWith("image/") ? /* @__PURE__ */ jsx(AttachmentImage, { id, alt: filename, fetcher, className: "doc-file-image" }) : null,
-    failure && /* @__PURE__ */ jsx("p", { role: "alert", className: "doc-file-video-fallback", children: failure })
-  ] });
-}
-function VideoView({ attrs }) {
-  const data = normalizeVideoEmbed(attrs), source = data ? videoSourceUrl(data) : "", platform = data ? VIDEO_PROVIDER_LABELS[data.provider] : "外部";
-  const [playing, setPlaying] = useState(""), [fits, setFits] = useState(true), [delayed, setDelayed] = useState(false);
-  const root = useRef(null), timer = useRef(void 0);
-  useEffect(() => {
-    if (!root.current || typeof ResizeObserver === "undefined") return;
-    const observer = new ResizeObserver(([entry]) => setFits(entry.contentRect.width >= 200));
-    observer.observe(root.current);
-    return () => observer.disconnect();
-  }, []);
-  useEffect(() => {
-    setPlaying("");
-    setDelayed(false);
-    clearTimeout(timer.current);
-    return () => clearTimeout(timer.current);
-  }, [source, fits]);
-  const active = !!source && playing === source;
-  return /* @__PURE__ */ jsx("section", { ref: root, className: "doc-video-embed", contentEditable: false, "aria-label": `${platform} 视频`, children: data ? /* @__PURE__ */ jsxs(Fragment, { children: [
-    !active || !fits ? /* @__PURE__ */ jsxs("div", { className: "video-placeholder", children: [
-      /* @__PURE__ */ jsx("span", { className: "video-play-icon", "aria-hidden": "true", children: "▶" }),
-      /* @__PURE__ */ jsxs("strong", { children: [
-        platform,
-        " 视频",
-        data.page > 1 ? ` · 第 ${data.page} P` : ""
-      ] }),
-      /* @__PURE__ */ jsx("span", { className: "video-id", children: data.videoId }),
-      fits && /* @__PURE__ */ jsx("button", { type: "button", className: "video-load", onClick: () => {
-        setPlaying(source);
-        timer.current = setTimeout(() => setDelayed(true), 12e3);
-      }, children: "加载视频" }),
-      /* @__PURE__ */ jsx("span", { className: "small muted", children: fits ? `点击后连接 ${platform} 播放器` : "当前栏宽较窄，请在原站观看" })
-    ] }) : /* @__PURE__ */ jsx(
-      "iframe",
-      {
-        src: videoPlayerUrl(data),
-        title: `${platform} 视频 ${data.videoId}`,
-        loading: "lazy",
-        allow: "fullscreen; picture-in-picture; encrypted-media",
-        allowFullScreen: true,
-        sandbox: "allow-scripts allow-same-origin allow-presentation allow-popups",
-        referrerPolicy: "strict-origin-when-cross-origin",
-        onLoad: () => {
-          clearTimeout(timer.current);
-          setDelayed(false);
-        }
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "video-footer", children: [
-      /* @__PURE__ */ jsx("span", { className: "small muted", children: active ? delayed ? "加载较慢，可在原站观看" : "无法播放时可在原站观看" : "外部视频" }),
-      /* @__PURE__ */ jsx("a", { href: source, target: "_blank", rel: "noopener noreferrer", onClick: (event) => event.stopPropagation(), children: "在原站打开 ↗" })
-    ] })
-  ] }) : /* @__PURE__ */ jsx("p", { className: "muted", children: "视频地址无效，请重新插入。" }) });
-}
-function TopicLabel({ topic }) {
-  return /* @__PURE__ */ jsx("span", { children: (topic.runs ?? [{ text: topic.text || "未命名主题" }]).map((run, index) => {
-    var _a, _b, _c, _d;
-    let child = run.text;
-    for (const mark of run.marks ?? []) {
-      if (mark.type === "bold") child = /* @__PURE__ */ jsx("strong", { children: child });
-      else if (mark.type === "italic") child = /* @__PURE__ */ jsx("em", { children: child });
-      else if (mark.type === "strike") child = /* @__PURE__ */ jsx("s", { children: child });
-      else if (mark.type === "link") child = /* @__PURE__ */ jsx("a", { href: safeHref((_a = mark.attrs) == null ? void 0 : _a.href), target: "_blank", rel: "noopener noreferrer", onClick: (event) => event.stopPropagation(), children: child });
-      else if (mark.type === "textStyle" || mark.type === "highlight") {
-        const data = documentColorAttributes(mark.type === "highlight" ? "highlight" : "text", (_b = mark.attrs) == null ? void 0 : _b.color);
-        const style = mark.type === "highlight" ? { backgroundColor: (_c = data.style) == null ? void 0 : _c.slice(data.style.indexOf(":") + 1).trim() } : { color: (_d = data.style) == null ? void 0 : _d.slice(data.style.indexOf(":") + 1).trim() };
-        child = /* @__PURE__ */ jsx("span", { style, children: child });
-      }
-    }
-    return /* @__PURE__ */ jsx(Fragment$1, { children: child }, index);
-  }) });
-}
-let context;
-setMindTextMeasureFactory((fontSize, weight) => {
-  if (typeof document === "undefined") return null;
-  context ?? (context = document.createElement("canvas").getContext("2d"));
-  if (!context) return null;
-  const canvas = context, font = `${weight} ${fontSize}px ${MIND_TOPIC_FONT}`;
-  return (text) => {
-    canvas.font = font;
-    return canvas.measureText(text).width;
-  };
-});
-export {
-  AttachmentImage as A,
-  FileView as F,
-  ImagePreview as I,
-  MathView as M,
-  TopicLabel as T,
-  VideoView as V,
-  previewItemsFrom as p
-};