react-ebookjs 0.0.3 → 0.0.5

package/dist/index.mjs

@@ -1705,202 +1705,6 @@ getSectionFractions_fn = function() {
   return results;
 };
 
-// src/vendor/foliate-js/search.js
-var CONTEXT_LENGTH = 50;
-var normalizeWhitespace3 = (str) => str.replace(/\s+/g, " ");
-var makeExcerpt = (strs, { startIndex, startOffset, endIndex, endOffset }) => {
-  const start = strs[startIndex];
-  const end = strs[endIndex];
-  const match = start === end ? start.slice(startOffset, endOffset) : start.slice(startOffset) + strs.slice(start + 1, end).join("") + end.slice(0, endOffset);
-  const trimmedStart = normalizeWhitespace3(start.slice(0, startOffset)).trimStart();
-  const trimmedEnd = normalizeWhitespace3(end.slice(endOffset)).trimEnd();
-  const ellipsisPre = trimmedStart.length < CONTEXT_LENGTH ? "" : "\u2026";
-  const ellipsisPost = trimmedEnd.length < CONTEXT_LENGTH ? "" : "\u2026";
-  const pre = `${ellipsisPre}${trimmedStart.slice(-CONTEXT_LENGTH)}`;
-  const post = `${trimmedEnd.slice(0, CONTEXT_LENGTH)}${ellipsisPost}`;
-  return { pre, match, post };
-};
-var simpleSearch = function* (strs, query, options = {}) {
-  const { locales = "en", sensitivity } = options;
-  const matchCase = sensitivity === "variant";
-  const haystack = strs.join("");
-  const lowerHaystack = matchCase ? haystack : haystack.toLocaleLowerCase(locales);
-  const needle = matchCase ? query : query.toLocaleLowerCase(locales);
-  const needleLength = needle.length;
-  let index = -1;
-  let strIndex = -1;
-  let sum = 0;
-  do {
-    index = lowerHaystack.indexOf(needle, index + 1);
-    if (index > -1) {
-      while (sum <= index) sum += strs[++strIndex].length;
-      const startIndex = strIndex;
-      const startOffset = index - (sum - strs[strIndex].length);
-      const end = index + needleLength;
-      while (sum <= end) sum += strs[++strIndex].length;
-      const endIndex = strIndex;
-      const endOffset = end - (sum - strs[strIndex].length);
-      const range = { startIndex, startOffset, endIndex, endOffset };
-      yield { range, excerpt: makeExcerpt(strs, range) };
-    }
-  } while (index > -1);
-};
-var segmenterSearch = function* (strs, query, options = {}) {
-  const { locales = "en", granularity = "word", sensitivity = "base" } = options;
-  let segmenter, collator;
-  try {
-    segmenter = new Intl.Segmenter(locales, { usage: "search", granularity });
-    collator = new Intl.Collator(locales, { sensitivity });
-  } catch (e) {
-    console.warn(e);
-    segmenter = new Intl.Segmenter("en", { usage: "search", granularity });
-    collator = new Intl.Collator("en", { sensitivity });
-  }
-  const queryLength = Array.from(segmenter.segment(query)).length;
-  const substrArr = [];
-  let strIndex = 0;
-  let segments = segmenter.segment(strs[strIndex])[Symbol.iterator]();
-  main: while (strIndex < strs.length) {
-    while (substrArr.length < queryLength) {
-      const { done, value } = segments.next();
-      if (done) {
-        strIndex++;
-        if (strIndex < strs.length) {
-          segments = segmenter.segment(strs[strIndex])[Symbol.iterator]();
-          continue;
-        } else break main;
-      }
-      const { index, segment } = value;
-      if (!/[^\p{Format}]/u.test(segment)) continue;
-      if (/\s/u.test(segment)) {
-        if (!/\s/u.test(substrArr[substrArr.length - 1]?.segment))
-          substrArr.push({ strIndex, index, segment: " " });
-        continue;
-      }
-      value.strIndex = strIndex;
-      substrArr.push(value);
-    }
-    const substr = substrArr.map((x) => x.segment).join("");
-    if (collator.compare(query, substr) === 0) {
-      const endIndex = strIndex;
-      const lastSeg = substrArr[substrArr.length - 1];
-      const endOffset = lastSeg.index + lastSeg.segment.length;
-      const startIndex = substrArr[0].strIndex;
-      const startOffset = substrArr[0].index;
-      const range = { startIndex, startOffset, endIndex, endOffset };
-      yield { range, excerpt: makeExcerpt(strs, range) };
-    }
-    substrArr.shift();
-  }
-};
-var search = (strs, query, options) => {
-  const { granularity = "grapheme", sensitivity = "base" } = options;
-  if (!Intl?.Segmenter || granularity === "grapheme" && (sensitivity === "variant" || sensitivity === "accent"))
-    return simpleSearch(strs, query, options);
-  return segmenterSearch(strs, query, options);
-};
-var searchMatcher = (textWalker2, opts) => {
-  const { defaultLocale, matchCase, matchDiacritics, matchWholeWords } = opts;
-  return function* (doc, query) {
-    const iter = textWalker2(doc, function* (strs, makeRange2) {
-      for (const result of search(strs, query, {
-        locales: doc.body.lang || doc.documentElement.lang || defaultLocale || "en",
-        granularity: matchWholeWords ? "word" : "grapheme",
-        sensitivity: matchDiacritics && matchCase ? "variant" : matchDiacritics && !matchCase ? "accent" : !matchDiacritics && matchCase ? "case" : "base"
-      })) {
-        const { startIndex, startOffset, endIndex, endOffset } = result.range;
-        result.range = makeRange2(startIndex, startOffset, endIndex, endOffset);
-        yield result;
-      }
-    });
-    for (const result of iter) yield result;
-  };
-};
-
-// src/vendor/foliate-js/text-walker.js
-var walkRange = (range, walker) => {
-  const nodes = [];
-  for (let node = walker.currentNode; node; node = walker.nextNode()) {
-    const compare = range.comparePoint(node, 0);
-    if (compare === 0) nodes.push(node);
-    else if (compare > 0) break;
-  }
-  return nodes;
-};
-var walkDocument = (_, walker) => {
-  const nodes = [];
-  for (let node = walker.nextNode(); node; node = walker.nextNode())
-    nodes.push(node);
-  return nodes;
-};
-var filter = NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT | NodeFilter.SHOW_CDATA_SECTION;
-var acceptNode = (node) => {
-  if (node.nodeType === 1) {
-    const name = node.tagName.toLowerCase();
-    if (name === "script" || name === "style") return NodeFilter.FILTER_REJECT;
-    return NodeFilter.FILTER_SKIP;
-  }
-  return NodeFilter.FILTER_ACCEPT;
-};
-var textWalker = function* (x, func) {
-  const root = x.commonAncestorContainer ?? x.body ?? x;
-  const walker = document.createTreeWalker(root, filter, { acceptNode });
-  const walk = x.commonAncestorContainer ? walkRange : walkDocument;
-  const nodes = walk(x, walker);
-  const strs = nodes.map((node) => node.nodeValue);
-  const makeRange2 = (startIndex, startOffset, endIndex, endOffset) => {
-    const range = document.createRange();
-    range.setStart(nodes[startIndex], startOffset);
-    range.setEnd(nodes[endIndex], endOffset);
-    return range;
-  };
-  for (const match of func(strs, makeRange2)) yield match;
-};
-
-// src/lib/search.ts
-var Search = class {
-  constructor(book, language, tocProgress) {
-    this.book = book;
-    this.language = language;
-    this.tocProgress = tocProgress;
-  }
-  getCFI(index, range) {
-    const baseCFI = this.book.sections?.[index]?.cfi ?? fake.fromIndex(index);
-    if (!range) return baseCFI;
-    return joinIndir(baseCFI, fromRange(range));
-  }
-  async *searchSection(matcher, query, index) {
-    const doc = await this.book.sections?.[index]?.createDocument();
-    for (const { range, excerpt } of matcher(doc, query))
-      yield { cfi: this.getCFI(index, range), excerpt };
-  }
-  async *searchBook(matcher, query) {
-    const { sections } = this.book;
-    if (!sections) return;
-    for (const [index, section] of sections.entries()) {
-      if (!section?.createDocument) continue;
-      const doc = await section.createDocument();
-      const subitems = Array.from(matcher(doc, query), ({ range, excerpt }) => ({ cfi: this.getCFI(index, range), excerpt }));
-      if (subitems.length) yield { index, subitems };
-    }
-  }
-  async *search({ query, index }) {
-    const matcher = searchMatcher(textWalker, { defaultLocale: this.language, query, index });
-    const iter = index != null ? this.searchSection(matcher, query, index) : this.searchBook(matcher, query);
-    for await (const result of iter) {
-      if ("subitems" in result && result.subitems) {
-        yield {
-          label: this.tocProgress?.getProgress(result.index)?.label ?? "",
-          subitems: result.subitems
-        };
-      } else {
-        yield result;
-      }
-    }
-    yield "done";
-  }
-};
-
 // src/vendor/foliate-js/overlayer.js
 var createSVGElement = (tag) => document.createElementNS("http://www.w3.org/2000/svg", tag);
 var _svg, _map;
@@ -2148,7 +1952,7 @@ var {
   FILTER_REJECT,
   FILTER_SKIP
 } = NodeFilter;
-var filter2 = SHOW_ELEMENT | SHOW_TEXT | SHOW_CDATA_SECTION;
+var filter = SHOW_ELEMENT | SHOW_TEXT | SHOW_CDATA_SECTION;
 var getBoundingClientRect = (target) => {
   let top = Infinity, right = -Infinity, left = Infinity, bottom = -Infinity;
   for (const rect of target.getClientRects()) {
@@ -2176,7 +1980,7 @@ var getVisibleRange = (doc, start, end, mapRect) => {
     }
     return FILTER_SKIP;
   };
-  const walker = doc.createTreeWalker(doc.body, filter2, { acceptNode: acceptNode2 });
+  const walker = doc.createTreeWalker(doc.body, filter, { acceptNode: acceptNode2 });
   const nodes = [];
   for (let node = walker.nextNode(); node; node = walker.nextNode())
     nodes.push(node);
@@ -3422,38 +3226,67 @@ function useReader() {
   }
   return context;
 }
+var resolveNavigation = (book, target, sectionProgress) => {
+  if (typeof target === "number") {
+    return { index: target };
+  } else if (typeof target === "object") {
+    const [index, anchor] = sectionProgress.getSection(target.fraction);
+    return { index, anchor };
+  } else if (isCFI.test(target)) {
+    if (book.resolveCFI) {
+      return book.resolveCFI(target);
+    } else {
+      const parts = parse(target);
+      const index = fake.toIndex((parts.parent ?? parts).shift());
+      const anchor = (doc) => toRange(doc, parts);
+      return { index, anchor };
+    }
+  } else {
+    const href = book.resolveHref?.(target);
+    if (href === null) return;
+    return href;
+  }
+};
 function Reader({ book, progress, onProgressChange, children }) {
   const rendererRef = React.useRef(null);
   const sectionProgress = React.useMemo(() => new SectionProgress(book.sections, 1500, 1600), [book]);
   const [tocProgress, setTocProgress] = React.useState();
   const [currentProgress, setCurrentProgress] = React.useState(0);
-  const resolveNavigation = (target) => {
-    if (typeof target === "number") {
-      return { index: target };
-    } else if (typeof target === "object") {
-      const [index, anchor] = sectionProgress.getSection(target.fraction);
-      return { index, anchor };
-    } else if (isCFI.test(target)) {
-      if (book.resolveCFI) {
-        return book.resolveCFI(target);
-      } else {
-        const parts = parse(target);
-        const index = fake.toIndex((parts.parent ?? parts).shift());
-        const anchor = (doc) => toRange(doc, parts);
-        return { index, anchor };
+  const [annotations, setAnnotations] = React.useState([]);
+  const addAnnotation = React.useCallback((cfi) => {
+    const resolved = resolveNavigation(book, cfi, sectionProgress);
+    if (resolved) {
+      const content = rendererRef.current?.getContents().find((x) => x.index === resolved.index && x.overlayer);
+      if (content && "overlayer" in content) {
+        const { overlayer, doc } = content;
+        const range = doc && typeof resolved.anchor === "function" ? resolved.anchor(doc) : resolved.anchor;
+        overlayer.add(cfi, range, Overlayer.outline);
       }
-    } else {
-      const href = book.resolveHref?.(target);
-      if (href === null) return;
-      return href;
+      setAnnotations((prev) => [...prev, cfi]);
     }
-  };
-  async function goTo(target) {
-    const resolved = resolveNavigation(target);
+  }, [book, sectionProgress, rendererRef]);
+  const removeAnnotation = React.useCallback((cfi) => {
+    const content = rendererRef.current?.getContents();
+    if (!content) return;
+    for (const item of content) {
+      if ("overlayer" in item) {
+        const { overlayer } = item;
+        overlayer.remove(cfi);
+      }
+    }
+    setAnnotations((prev) => prev.filter((x) => x !== cfi));
+  }, [rendererRef]);
+  const clearAnnotations = React.useCallback(() => {
+    for (const cfi of annotations) {
+      removeAnnotation(cfi);
+    }
+  }, [annotations, removeAnnotation]);
+  const goTo = React.useCallback(async (target) => {
+    const resolved = resolveNavigation(book, target, sectionProgress);
     if (resolved) {
       await rendererRef.current?.goTo(resolved);
     }
-  }
+  }, [book, sectionProgress]);
   React.useEffect(() => {
     if (book.splitTOCHref && book.getTOCFragment) {
       const ids = book.sections?.map((s) => s?.id);
@@ -3487,7 +3320,19 @@ function Reader({ book, progress, onProgressChange, children }) {
   async function previous(distance) {
     await rendererRef.current?.prev(distance);
   }
-  return /* @__PURE__ */ jsx(ReaderContext.Provider, { value: { book, sectionProgress, tocProgress, rendererRef, goTo, resolveNavigation, next, previous }, children });
+  return /* @__PURE__ */ jsx(ReaderContext.Provider, { value: {
+    book,
+    sectionProgress,
+    annotations,
+    tocProgress,
+    rendererRef,
+    goTo,
+    next,
+    previous,
+    addAnnotation,
+    removeAnnotation,
+    clearAnnotations
+  }, children });
 }
 function ReaderContent({
   fontSize = 16,
@@ -3496,7 +3341,7 @@ function ReaderContent({
   hyphenate = true,
   flow = "paginated"
 }) {
-  const { book, rendererRef } = useReader();
+  const { book, rendererRef, annotations, sectionProgress, goTo } = useReader();
   const info = languageInfo(book);
   React.useEffect(() => {
     const renderer = rendererRef.current;
@@ -3510,17 +3355,44 @@ function ReaderContent({
             console.log(value, range, index);
           }
         });
+        for (const cfi of annotations) {
+          const resolved = resolveNavigation(book, cfi, sectionProgress);
+          if (resolved) {
+            if (index === resolved.index) {
+              const range = doc && typeof resolved.anchor === "function" ? resolved.anchor(doc) : resolved.anchor;
+              overlayer.add(cfi, range, Overlayer.outline);
+            }
+          }
+        }
         attach(overlayer);
       };
+      const onLoad = (e) => {
+        const { doc, index } = e.detail;
+        const section = book.sections?.[index];
+        doc.addEventListener("click", (e2) => {
+          const a = e2.target.closest("a[href]");
+          if (!a) return;
+          e2.preventDefault();
+          const hrefAttr = a.getAttribute("href");
+          const href = section?.resolveHref?.(hrefAttr) ?? hrefAttr;
+          if (book?.isExternal?.(href)) {
+            globalThis.open(href, "_blank");
+          } else {
+            goTo(href);
+          }
+        });
+      };
       renderer.addEventListener("create-overlayer", createOverlayer);
+      renderer.addEventListener("load", onLoad);
       renderer.setAttribute("exportparts", "head,foot,filter");
       renderer.open(book);
       renderer.next();
       return () => {
         renderer.removeEventListener("create-overlayer", createOverlayer);
+        renderer.removeEventListener("load", onLoad);
       };
     }
-  }, [book, rendererRef]);
+  }, [book, rendererRef, annotations, goTo]);
   React.useEffect(() => {
     if (!rendererRef.current) return;
     const css = `
@@ -3551,7 +3423,7 @@ function ReaderContent({
     }
   }, [fontSize, lineSpacing, justify, hyphenate, flow]);
   const isFixedLayout = book.rendition?.layout === "pre-paginated";
-  const Renderer = isFixedLayout ? "foliate-fixed-layout" : "foliate-paginator";
+  const Renderer = isFixedLayout ? "foliate-fxl" : "foliate-paginator";
   return /* @__PURE__ */ jsx(
     Renderer,
     {
@@ -3569,48 +3441,223 @@ function ReaderPrevious({ children, ...props }) {
   const { previous } = useReader();
   return /* @__PURE__ */ jsx("button", { onClick: () => previous(), ...props, children });
 }
+
+// src/hooks/useBookNavigation.ts
 function useBookNavigator() {
   const { goTo, next, previous } = useReader();
   return { goTo, next, previous };
 }
-function useSearch(query) {
-  const { book, tocProgress, rendererRef, resolveNavigation } = useReader();
-  const [loading, setLoading] = React.useState(false);
-  const [results, setResults] = React.useState();
-  const [annotations, setAnnotations] = React.useState([]);
-  React.useEffect(() => {
-    if (!rendererRef.current) return;
-    for (const cfi of annotations) {
-      const content = rendererRef.current?.getContents();
-      for (const item of content) {
-        if ("overlayer" in item) {
-          const { overlayer } = item;
-          overlayer.remove(cfi);
-        }
+
+// src/hooks/useSearch.ts
+import * as React2 from "react";
+
+// src/vendor/foliate-js/search.js
+var CONTEXT_LENGTH = 50;
+var normalizeWhitespace3 = (str) => str.replace(/\s+/g, " ");
+var makeExcerpt = (strs, { startIndex, startOffset, endIndex, endOffset }) => {
+  const start = strs[startIndex];
+  const end = strs[endIndex];
+  const match = start === end ? start.slice(startOffset, endOffset) : start.slice(startOffset) + strs.slice(start + 1, end).join("") + end.slice(0, endOffset);
+  const trimmedStart = normalizeWhitespace3(start.slice(0, startOffset)).trimStart();
+  const trimmedEnd = normalizeWhitespace3(end.slice(endOffset)).trimEnd();
+  const ellipsisPre = trimmedStart.length < CONTEXT_LENGTH ? "" : "\u2026";
+  const ellipsisPost = trimmedEnd.length < CONTEXT_LENGTH ? "" : "\u2026";
+  const pre = `${ellipsisPre}${trimmedStart.slice(-CONTEXT_LENGTH)}`;
+  const post = `${trimmedEnd.slice(0, CONTEXT_LENGTH)}${ellipsisPost}`;
+  return { pre, match, post };
+};
+var simpleSearch = function* (strs, query, options = {}) {
+  const { locales = "en", sensitivity } = options;
+  const matchCase = sensitivity === "variant";
+  const haystack = strs.join("");
+  const lowerHaystack = matchCase ? haystack : haystack.toLocaleLowerCase(locales);
+  const needle = matchCase ? query : query.toLocaleLowerCase(locales);
+  const needleLength = needle.length;
+  let index = -1;
+  let strIndex = -1;
+  let sum = 0;
+  do {
+    index = lowerHaystack.indexOf(needle, index + 1);
+    if (index > -1) {
+      while (sum <= index) sum += strs[++strIndex].length;
+      const startIndex = strIndex;
+      const startOffset = index - (sum - strs[strIndex].length);
+      const end = index + needleLength;
+      while (sum <= end) sum += strs[++strIndex].length;
+      const endIndex = strIndex;
+      const endOffset = end - (sum - strs[strIndex].length);
+      const range = { startIndex, startOffset, endIndex, endOffset };
+      yield { range, excerpt: makeExcerpt(strs, range) };
+    }
+  } while (index > -1);
+};
+var segmenterSearch = function* (strs, query, options = {}) {
+  const { locales = "en", granularity = "word", sensitivity = "base" } = options;
+  let segmenter, collator;
+  try {
+    segmenter = new Intl.Segmenter(locales, { usage: "search", granularity });
+    collator = new Intl.Collator(locales, { sensitivity });
+  } catch (e) {
+    console.warn(e);
+    segmenter = new Intl.Segmenter("en", { usage: "search", granularity });
+    collator = new Intl.Collator("en", { sensitivity });
+  }
+  const queryLength = Array.from(segmenter.segment(query)).length;
+  const substrArr = [];
+  let strIndex = 0;
+  let segments = segmenter.segment(strs[strIndex])[Symbol.iterator]();
+  main: while (strIndex < strs.length) {
+    while (substrArr.length < queryLength) {
+      const { done, value } = segments.next();
+      if (done) {
+        strIndex++;
+        if (strIndex < strs.length) {
+          segments = segmenter.segment(strs[strIndex])[Symbol.iterator]();
+          continue;
+        } else break main;
+      }
+      const { index, segment } = value;
+      if (!/[^\p{Format}]/u.test(segment)) continue;
+      if (/\s/u.test(segment)) {
+        if (!/\s/u.test(substrArr[substrArr.length - 1]?.segment))
+          substrArr.push({ strIndex, index, segment: " " });
+        continue;
       }
+      value.strIndex = strIndex;
+      substrArr.push(value);
     }
+    const substr = substrArr.map((x) => x.segment).join("");
+    if (collator.compare(query, substr) === 0) {
+      const endIndex = strIndex;
+      const lastSeg = substrArr[substrArr.length - 1];
+      const endOffset = lastSeg.index + lastSeg.segment.length;
+      const startIndex = substrArr[0].strIndex;
+      const startOffset = substrArr[0].index;
+      const range = { startIndex, startOffset, endIndex, endOffset };
+      yield { range, excerpt: makeExcerpt(strs, range) };
+    }
+    substrArr.shift();
+  }
+};
+var search = (strs, query, options) => {
+  const { granularity = "grapheme", sensitivity = "base" } = options;
+  if (!Intl?.Segmenter || granularity === "grapheme" && (sensitivity === "variant" || sensitivity === "accent"))
+    return simpleSearch(strs, query, options);
+  return segmenterSearch(strs, query, options);
+};
+var searchMatcher = (textWalker2, opts) => {
+  const { defaultLocale, matchCase, matchDiacritics, matchWholeWords } = opts;
+  return function* (doc, query) {
+    const iter = textWalker2(doc, function* (strs, makeRange2) {
+      for (const result of search(strs, query, {
+        locales: doc.body.lang || doc.documentElement.lang || defaultLocale || "en",
+        granularity: matchWholeWords ? "word" : "grapheme",
+        sensitivity: matchDiacritics && matchCase ? "variant" : matchDiacritics && !matchCase ? "accent" : !matchDiacritics && matchCase ? "case" : "base"
+      })) {
+        const { startIndex, startOffset, endIndex, endOffset } = result.range;
+        result.range = makeRange2(startIndex, startOffset, endIndex, endOffset);
+        yield result;
+      }
+    });
+    for (const result of iter) yield result;
+  };
+};
+
+// src/vendor/foliate-js/text-walker.js
+var walkRange = (range, walker) => {
+  const nodes = [];
+  for (let node = walker.currentNode; node; node = walker.nextNode()) {
+    const compare = range.comparePoint(node, 0);
+    if (compare === 0) nodes.push(node);
+    else if (compare > 0) break;
+  }
+  return nodes;
+};
+var walkDocument = (_, walker) => {
+  const nodes = [];
+  for (let node = walker.nextNode(); node; node = walker.nextNode())
+    nodes.push(node);
+  return nodes;
+};
+var filter2 = NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT | NodeFilter.SHOW_CDATA_SECTION;
+var acceptNode = (node) => {
+  if (node.nodeType === 1) {
+    const name = node.tagName.toLowerCase();
+    if (name === "script" || name === "style") return NodeFilter.FILTER_REJECT;
+    return NodeFilter.FILTER_SKIP;
+  }
+  return NodeFilter.FILTER_ACCEPT;
+};
+var textWalker = function* (x, func) {
+  const root = x.commonAncestorContainer ?? x.body ?? x;
+  const walker = document.createTreeWalker(root, filter2, { acceptNode });
+  const walk = x.commonAncestorContainer ? walkRange : walkDocument;
+  const nodes = walk(x, walker);
+  const strs = nodes.map((node) => node.nodeValue);
+  const makeRange2 = (startIndex, startOffset, endIndex, endOffset) => {
+    const range = document.createRange();
+    range.setStart(nodes[startIndex], startOffset);
+    range.setEnd(nodes[endIndex], endOffset);
+    return range;
+  };
+  for (const match of func(strs, makeRange2)) yield match;
+};
+
+// src/lib/search.ts
+function getCFI(book, index, range) {
+  const baseCFI = book.sections?.[index]?.cfi ?? fake.fromIndex(index);
+  if (!range) return baseCFI;
+  return joinIndir(baseCFI, fromRange(range));
+}
+function createSearcher(book, language, tocProgress) {
+  async function* searchSection(matcher, query, index) {
+    const doc = await book.sections?.[index]?.createDocument();
+    for (const { range, excerpt } of matcher(doc, query))
+      yield { cfi: getCFI(book, index, range), excerpt };
+  }
+  async function* searchBook(matcher, query) {
+    const { sections } = book;
+    if (!sections) return;
+    for (const [index, section] of sections.entries()) {
+      if (!section?.createDocument) continue;
+      const doc = await section.createDocument();
+      const subitems = Array.from(matcher(doc, query), ({ range, excerpt }) => ({ cfi: getCFI(book, index, range), excerpt }));
+      if (subitems.length) yield { index, subitems };
+    }
+  }
+  async function* search2({ query, index }) {
+    const matcher = searchMatcher(textWalker, { defaultLocale: language, query, index });
+    const iter = index !== void 0 ? searchSection(matcher, query, index) : searchBook(matcher, query);
+    for await (const result of iter) {
+      if ("subitems" in result && result.subitems) {
+        yield {
+          label: tocProgress?.getProgress(result.index)?.label ?? "",
+          subitems: result.subitems
+        };
+      } else {
+        yield result;
+      }
+    }
+    yield "done";
+  }
+  return search2;
+}
+
+// src/hooks/useSearch.ts
+function useSearch(query) {
+  const { book, tocProgress, rendererRef, addAnnotation, clearAnnotations } = useReader();
+  const [loading, setLoading] = React2.useState(false);
+  const [results, setResults] = React2.useState();
+  React2.useEffect(() => {
+    if (!rendererRef.current) return;
     setResults(void 0);
-    setAnnotations([]);
+    clearAnnotations();
     if (query) {
-      let addAnnotation2 = function(cfi) {
-        const resolved = resolveNavigation(cfi);
-        if (resolved) {
-          const content = rendererRef.current?.getContents().find((x) => x.index === resolved.index && x.overlayer);
-          if (content && "overlayer" in content) {
-            const { overlayer, doc } = content;
-            const range = doc && typeof resolved.anchor === "function" ? resolved.anchor(doc) : resolved.anchor;
-            overlayer.add(cfi, range, Overlayer.outline);
-            setAnnotations((prev) => [...prev, cfi]);
-          }
-        }
-      };
-      var addAnnotation = addAnnotation2;
       setLoading(true);
       const abortController = new AbortController();
-      const searchResults = [];
       const language = languageInfo(book)?.canonical ?? "en";
-      const search2 = new Search(book, language, tocProgress);
-      const searchIterator = search2.search({ query });
+      const search2 = createSearcher(book, language, tocProgress);
+      const searchIterator = search2({ query });
       const processSearchResults = async () => {
         for await (const result of searchIterator) {
           if (abortController.signal.aborted) return;
@@ -3619,13 +3666,12 @@ function useSearch(query) {
             break;
           }
           if ("label" in result && typeof result.label === "string") {
-            searchResults.push({ label: result.label, href: result.subitems[0].cfi });
-            setResults([...searchResults]);
+            setResults((prev) => [...prev ?? [], { label: result.label, href: result.subitems[0].cfi }]);
             for (const item of result.subitems) {
-              addAnnotation2(item.cfi);
+              addAnnotation(item.cfi);
             }
           } else if ("cfi" in result && typeof result.cfi === "string") {
-            addAnnotation2(result.cfi);
+            addAnnotation(result.cfi);
           }
         }
       };