wendang-react 0.0.0-stage → 0.5.6

package/dist/chunks/comment-hint-DN7LKJAn.js

@@ -0,0 +1,296 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+import { codeLanguageLabel, CODE_LANGUAGES, isKnownCodeLanguage } from "wendang/shared";
+import { W as WButton, a as WSelect, b as WIcon } from "./index-Ii536CFG.js";
+import { A as AnchoredPanel } from "./AnchoredPanel-D3nte06T.js";
+import { b as useContentHost } from "./host-C-V688Rq.js";
+import { CODE_THEMES, codeLineCount } from "wendang/internal/code-block";
+function CodeToolbar({ text, language, editable, canCopy, display, onLanguage, onDisplay }) {
+  const host = useContentHost();
+  const [feedback, setFeedback] = useState(""), [copying, setCopying] = useState(false), [menu, setMenu] = useState(false);
+  const [foldTip, setFoldTip] = useState(false), foldTrigger = useRef(null), hoverTimer = useRef(void 0);
+  const trigger = useRef(null), menuRoot = useRef(null), timer = useRef(void 0);
+  const alive = useRef(true), running = useRef(false), latest = useRef({ display, onDisplay, canCopy, text });
+  latest.current = { display, onDisplay, canCopy, text };
+  useEffect(() => {
+    alive.current = true;
+    return () => {
+      alive.current = false;
+      clearTimeout(timer.current);
+      clearTimeout(hoverTimer.current);
+    };
+  }, []);
+  useEffect(() => {
+    var _a;
+    try {
+      const saved = (_a = host.preferences) == null ? void 0 : _a.get("code-theme");
+      if (CODE_THEMES.some((item) => item.value === saved) && saved !== latest.current.display.theme)
+        latest.current.onDisplay({ ...latest.current.display, theme: saved });
+    } catch {
+    }
+  }, [host.preferences]);
+  useEffect(() => {
+    if (!foldTip) return;
+    const close = () => setFoldTip(false);
+    window.addEventListener("scroll", close, true);
+    return () => window.removeEventListener("scroll", close, true);
+  }, [foldTip]);
+  function showFoldTip() {
+    clearTimeout(hoverTimer.current);
+    hoverTimer.current = setTimeout(() => setFoldTip(true), 200);
+  }
+  function hideFoldTip() {
+    clearTimeout(hoverTimer.current);
+    setFoldTip(false);
+  }
+  function update(patch) {
+    onDisplay({ ...display, ...patch });
+  }
+  function settings(value) {
+    var _a;
+    if (value === "numbers") update({ lineNumbers: !display.lineNumbers });
+    else if (value === "height") update({ limited: !display.limited });
+    else if (CODE_THEMES.some((theme) => theme.value === value)) {
+      try {
+        (_a = host.preferences) == null ? void 0 : _a.set("code-theme", value);
+      } catch {
+      }
+      update({ theme: value });
+    }
+    setMenu(false);
+  }
+  const label = language === "plaintext" ? "纯文本" : codeLanguageLabel(language) || "自动识别";
+  const options = [
+    { value: "", label: "自动识别" },
+    { value: "plaintext", label: "纯文本" },
+    ...CODE_LANGUAGES.filter((item) => item.value),
+    ...!language || language === "plaintext" || isKnownCodeLanguage(language) ? [] : [{ value: language, label: language }]
+  ];
+  async function copy() {
+    if (!latest.current.canCopy || running.current) return;
+    running.current = true;
+    setCopying(true);
+    try {
+      await navigator.clipboard.writeText(latest.current.text);
+      if (alive.current) setFeedback("已复制");
+    } catch {
+      if (alive.current) setFeedback("复制失败，请重试");
+    } finally {
+      running.current = false;
+      if (alive.current) setCopying(false);
+    }
+    if (!alive.current) return;
+    clearTimeout(timer.current);
+    timer.current = setTimeout(() => {
+      if (alive.current) setFeedback("");
+    }, 1800);
+  }
+  function menuKeydown(event) {
+    var _a, _b;
+    if (!menu || event.defaultPrevented || event.nativeEvent.isComposing || event.keyCode === 229) return;
+    if (event.key === "Escape") {
+      event.preventDefault();
+      setMenu(false);
+      (_a = trigger.current) == null ? void 0 : _a.focus();
+      return;
+    }
+    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key)) return;
+    const items = Array.from(((_b = menuRoot.current) == null ? void 0 : _b.querySelectorAll('[role="menuitem"],[role="menuitemradio"]')) ?? []);
+    if (!items.length) return;
+    event.preventDefault();
+    const index = items.indexOf(document.activeElement);
+    const next = event.key === "Home" ? 0 : event.key === "End" ? items.length - 1 : (index + (event.key === "ArrowUp" ? -1 : 1) + items.length) % items.length;
+    items[next].focus();
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "code-toolbar",
+      contentEditable: false,
+      "aria-label": "代码块工具栏",
+      onKeyDown: (event) => {
+        menuKeydown(event);
+        if (event.key === "Escape") hideFoldTip();
+        event.stopPropagation();
+      },
+      onPointerDown: (event) => event.stopPropagation(),
+      children: [
+        /* @__PURE__ */ jsx(
+          WButton,
+          {
+            ref: foldTrigger,
+            variant: "text",
+            size: "mini",
+            className: "code-fold-button",
+            "aria-label": display.collapsed ? "展开代码块" : "折叠代码块",
+            "aria-expanded": !display.collapsed,
+            onMouseEnter: showFoldTip,
+            onMouseLeave: hideFoldTip,
+            onFocus: showFoldTip,
+            onBlur: hideFoldTip,
+            onClick: () => update({ collapsed: !display.collapsed }),
+            children: /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", style: { transform: display.collapsed ? "rotate(-90deg)" : void 0 }, children: /* @__PURE__ */ jsx("path", { d: "m4 6 4 4 4-4", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" }) })
+          }
+        ),
+        foldTip && /* @__PURE__ */ jsx(AnchoredPanel, { anchor: foldTrigger.current, onClose: hideFoldTip, role: "tooltip", align: "center", prefer: "above", gap: 8, className: "code-tooltip-popup", children: /* @__PURE__ */ jsx("div", { className: "w-tooltip", children: display.collapsed ? "展开代码" : "折叠代码" }) }),
+        /* @__PURE__ */ jsxs("span", { className: "code-toolbar-summary", children: [
+          display.collapsed ? "已折叠 · " : "",
+          codeLineCount(text),
+          " 行"
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "code-toolbar-actions", children: [
+          editable ? /* @__PURE__ */ jsx(WSelect, { className: "code-language-select", ariaLabel: "代码语言", value: language, options, size: "small", searchable: true, onChange: onLanguage }) : /* @__PURE__ */ jsx("span", { className: "code-language-label", children: label }),
+          /* @__PURE__ */ jsx("span", { className: "code-toolbar-divider", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsxs(
+            WButton,
+            {
+              variant: "text",
+              size: "mini",
+              className: "code-copy-button",
+              "aria-label": "复制代码",
+              disabled: !canCopy,
+              loading: copying,
+              title: canCopy ? "复制完整代码" : "当前空间未开放导出",
+              onClick: () => void copy(),
+              children: [
+                /* @__PURE__ */ jsx(WIcon, { name: "copy", size: 14 }),
+                /* @__PURE__ */ jsx("span", { children: feedback || "复制代码" })
+              ]
+            }
+          ),
+          feedback && /* @__PURE__ */ jsx("span", { className: "code-copy-announcement", role: "status", children: feedback }),
+          /* @__PURE__ */ jsx(
+            WButton,
+            {
+              ref: trigger,
+              variant: "text",
+              size: "mini",
+              className: "code-settings-button",
+              "aria-label": "代码块显示设置",
+              "aria-expanded": menu,
+              onClick: () => setMenu(!menu),
+              children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "···" })
+            }
+          ),
+          menu && /* @__PURE__ */ jsx(AnchoredPanel, { anchor: trigger.current, onClose: () => setMenu(false), role: "menu", label: "代码块显示设置", align: "end", gap: 6, className: "code-settings-popup", onKeyDown: menuKeydown, children: /* @__PURE__ */ jsxs("div", { ref: menuRoot, className: "w-dropdown", children: [
+            /* @__PURE__ */ jsxs("div", { className: "w-dropdown-group", role: "group", "aria-label": "配色主题", children: [
+              /* @__PURE__ */ jsx("div", { className: "w-dropdown-group__title", children: "配色主题" }),
+              CODE_THEMES.map((theme) => /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: "w-dropdown-option",
+                  role: "menuitemradio",
+                  tabIndex: -1,
+                  "aria-checked": display.theme === theme.value,
+                  onClick: () => settings(theme.value),
+                  onKeyDown: (event) => {
+                    if (event.key === "Enter" || event.key === " ") {
+                      event.preventDefault();
+                      settings(theme.value);
+                    }
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx("span", { className: "code-theme-swatch", "data-code-swatch": theme.value, "aria-hidden": "true" }),
+                    theme.label,
+                    display.theme === theme.value && /* @__PURE__ */ jsx("span", { className: "code-option-check", "aria-hidden": "true", children: "✓" })
+                  ]
+                },
+                theme.value
+              ))
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "w-dropdown-group", role: "group", children: [{ value: "numbers", label: display.lineNumbers ? "隐藏行号" : "显示行号" }, { value: "height", label: display.limited ? "取消高度限制" : "限制代码高度" }].map((option) => /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: "w-dropdown-option",
+                role: "menuitem",
+                tabIndex: -1,
+                onClick: () => settings(option.value),
+                onKeyDown: (event) => {
+                  if (event.key === "Enter" || event.key === " ") {
+                    event.preventDefault();
+                    settings(option.value);
+                  }
+                },
+                children: option.label
+              },
+              option.value
+            )) })
+          ] }) })
+        ] })
+      ]
+    }
+  );
+}
+const HINT_GAP = 8;
+const HINT_MIN_TOP_SPACE = 40;
+function commentHintPosition(rect, hint2, viewport) {
+  const center = rect.left + rect.width / 2;
+  const half = Math.max(0, hint2.width / 2);
+  const minLeft = half + 8;
+  const maxLeft = Math.max(minLeft, viewport.width - half - 8);
+  const left = Math.min(Math.max(center, minLeft), maxLeft);
+  const above = rect.top >= HINT_MIN_TOP_SPACE;
+  return above ? { left, top: rect.top - HINT_GAP, placement: "top" } : { left, top: rect.top + rect.height + HINT_GAP, placement: "bottom" };
+}
+let hint = null;
+let hideOnScroll = null;
+function tokenOf(element, name, fallback) {
+  const value = getComputedStyle(element).getPropertyValue(name).trim();
+  return value || fallback;
+}
+function showCommentHint(anchor, text) {
+  if (typeof document === "undefined") return;
+  if (!(anchor instanceof HTMLElement)) return;
+  hideCommentHint();
+  const el = document.createElement("div");
+  el.className = "doc-comment-hint";
+  el.setAttribute("role", "tooltip");
+  el.textContent = text;
+  el.style.cssText = [
+    "position:fixed",
+    "z-index:1300",
+    "pointer-events:none",
+    "transform:translateX(-50%)",
+    "padding:5px 9px",
+    `border:1px solid ${tokenOf(anchor, "--color-border", "#dce2eb")}`,
+    `background:${tokenOf(anchor, "--color-surface", "#ffffff")}`,
+    `color:${tokenOf(anchor, "--color-text", "#1f2937")}`,
+    "font-size:12px",
+    "line-height:1.5",
+    "white-space:nowrap",
+    "box-shadow:0 6px 20px #1018282e",
+    "border-radius:0"
+  ].join(";");
+  document.body.appendChild(el);
+  const rect = anchor.getBoundingClientRect();
+  const size = el.getBoundingClientRect();
+  const pos = commentHintPosition(
+    { left: rect.left, top: rect.top, width: rect.width, height: rect.height },
+    { width: size.width, height: size.height },
+    { width: window.innerWidth }
+  );
+  el.style.left = `${pos.left}px`;
+  el.style.top = `${pos.top}px`;
+  if (pos.placement === "bottom") el.style.transform = "translateX(-50%)";
+  else el.style.transform = "translateX(-50%) translateY(-100%)";
+  hint = el;
+  hideOnScroll = () => hideCommentHint();
+  window.addEventListener("scroll", hideOnScroll, true);
+  window.addEventListener("resize", hideOnScroll);
+}
+function hideCommentHint() {
+  if (!hint) return;
+  hint.remove();
+  hint = null;
+  if (hideOnScroll) {
+    window.removeEventListener("scroll", hideOnScroll, true);
+    window.removeEventListener("resize", hideOnScroll);
+    hideOnScroll = null;
+  }
+}
+export {
+  CodeToolbar as C,
+  hideCommentHint as h,
+  showCommentHint as s
+};

package/dist/chunks/composition-state-Bl-U1R_2.js

@@ -0,0 +1,40 @@
+"use client";
+const SETTLE_DELAY_MS = 0;
+let composing = false;
+let settleTimer = null;
+function isComposingNow() {
+  return composing;
+}
+function beginComposition() {
+  composing = true;
+  if (settleTimer !== null) {
+    clearTimeout(settleTimer);
+    settleTimer = null;
+  }
+}
+function endComposition() {
+  if (settleTimer !== null) clearTimeout(settleTimer);
+  settleTimer = setTimeout(() => {
+    composing = false;
+    settleTimer = null;
+  }, SETTLE_DELAY_MS);
+}
+function resetCompositionState() {
+  composing = false;
+  if (settleTimer !== null) {
+    clearTimeout(settleTimer);
+    settleTimer = null;
+  }
+}
+function shouldIgnoreForIme(event) {
+  return composing || event.isComposing === true || event.keyCode === 229;
+}
+const IME_SETTLE_DELAY_MS = SETTLE_DELAY_MS;
+export {
+  IME_SETTLE_DELAY_MS as I,
+  beginComposition as b,
+  endComposition as e,
+  isComposingNow as i,
+  resetCompositionState as r,
+  shouldIgnoreForIme as s
+};