leaflet.pub
a tool for shared writing and social publishing
fix popover number and threshold
awarm.space
+1
-1
components/Blocks/TextBlock/mountProsemirror.ts
+1
-1
components/Blocks/TextBlock/mountProsemirror.ts
···
91
91
if (!sup) return;
92
92
93
93
// On mobile/tablet, show popover
94
-
let isDesktop = window.matchMedia("(min-width: 1024px)").matches;
94
+
let isDesktop = window.matchMedia("(min-width: 1280px)").matches;
95
95
if (!isDesktop) {
96
96
let store = useFootnotePopoverStore.getState();
97
97
if (store.activeFootnoteID === footnoteID) {
+14
-2
components/Footnotes/FootnotePopover.tsx
+14
-2
components/Footnotes/FootnotePopover.tsx
···
1
1
"use client";
2
2
3
-
import { useEffect, useRef, useState, useCallback } from "react";
3
+
import { useEffect, useRef, useState, useCallback, useMemo } from "react";
4
4
import { create } from "zustand";
5
5
import { useFootnoteContext } from "./FootnoteContext";
6
6
import { FootnoteEditor } from "./FootnoteEditor";
···
32
32
let [position, setPosition] = useState<{ top: number; left: number; arrowLeft: number } | null>(null);
33
33
34
34
let footnote = footnotes.find((fn) => fn.footnoteEntityID === activeFootnoteID);
35
+
36
+
// Compute the displayed index from DOM order (matching CSS counters)
37
+
// rather than the data model order, which may differ if footnotes
38
+
// were inserted out of order within a block.
39
+
let displayIndex = useMemo(() => {
40
+
if (!anchorElement || !footnote) return footnote?.index ?? 0;
41
+
let container = anchorElement.closest('.postPageContent');
42
+
if (!container) return footnote.index;
43
+
let allRefs = Array.from(container.querySelectorAll('.footnote-ref'));
44
+
let pos = allRefs.indexOf(anchorElement);
45
+
return pos >= 0 ? pos + 1 : footnote.index;
46
+
}, [anchorElement, footnote]);
35
47
36
48
let updatePosition = useCallback(() => {
37
49
if (!anchorElement || !popoverRef.current) return;
···
110
122
>
111
123
<FootnoteEditor
112
124
footnoteEntityID={footnote.footnoteEntityID}
113
-
index={footnote.index}
125
+
index={displayIndex}
114
126
editable={permissions.write}
115
127
onDelete={
116
128
permissions.write