komado 0.1.0

package/dist/components/screens/LibraryScreen.js

@@ -0,0 +1,69 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef } from "react";
+import { Box, Text } from "ink";
+import { useUI } from "../../ui-context.js";
+import { getSource } from "../../sources/index.js";
+import { List } from "../List.js";
+import { Header, Spinner, ErrorView, KeyHints } from "../ui.js";
+import { truncate } from "../../lib/text.js";
+const PAGE = 32;
+function LibraryScreen({ params }) {
+  const sourceId = params?.sourceId || "mangadex";
+  const ui = useUI();
+  const source = getSource(sourceId);
+  const [results, setResults] = useState([]);
+  const [pagination, setPagination] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const reqId = useRef(0);
+  const fetchPage = async (offset, append) => {
+    const rid = ++reqId.current;
+    const ctrl = new AbortController();
+    setLoading(true);
+    setError(null);
+    try {
+      const res = await source.getFollows({ offset, limit: PAGE, signal: ctrl.signal });
+      if (rid !== reqId.current) return;
+      setResults((prev) => append ? [...prev, ...res.data] : res.data);
+      setPagination(res.pagination);
+    } catch (err) {
+      if (rid === reqId.current) setError(err);
+    } finally {
+      if (rid === reqId.current) setLoading(false);
+    }
+  };
+  useEffect(() => {
+    fetchPage(0, false);
+  }, []);
+  const loadMore = () => {
+    if (loading || !pagination?.hasMore) return;
+    fetchPage(pagination.offset + pagination.limit, true);
+  };
+  const onHighlight = (_item, index) => {
+    if (index >= results.length - 2) loadMore();
+  };
+  const listHeight = Math.max(4, (ui.dimensions.rows || 24) - 8);
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx(Header, { title: "My Library", subtitle: "manga you follow on MangaDex" }),
+    loading && !results.length ? /* @__PURE__ */ jsx(Spinner, { label: "Loading your follows" }) : null,
+    error ? /* @__PURE__ */ jsx(ErrorView, { error }) : null,
+    !error ? /* @__PURE__ */ jsx(
+      List,
+      {
+        items: results,
+        height: listHeight,
+        onSelect: (m) => ui.navigate("manga", { sourceId, manga: m }),
+        onHighlight,
+        emptyText: loading ? " " : "You are not following any manga yet.",
+        renderItem: (m, active) => /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Text, { inverse: active, color: active ? "cyanBright" : void 0, children: ` ${truncate(m.title, Math.max(20, (ui.dimensions.cols || 80) - 24))} ` }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  ${m.status || ""}` })
+        ] }, m.key)
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(KeyHints, { hints: [["\u2191\u2193", "move"], ["enter", "open"], ["esc", "back"]] })
+  ] });
+}
+export {
+  LibraryScreen
+};

package/dist/components/screens/LoginScreen.js

@@ -0,0 +1,85 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { Box, Text, useInput } from "ink";
+import TextInput from "ink-text-input";
+import { useUI } from "../../ui-context.js";
+import { login } from "../../sources/mangadex/auth.js";
+import { Header, Spinner, ErrorView, KeyHints } from "../ui.js";
+const FIELDS = [
+  { key: "clientId", label: "Client ID", mask: false },
+  { key: "clientSecret", label: "Client Secret", mask: true },
+  { key: "username", label: "Username / email", mask: false },
+  { key: "password", label: "Password", mask: true }
+];
+function LoginScreen() {
+  const ui = useUI();
+  const [vals, setVals] = useState({ clientId: "", clientSecret: "", username: "", password: "" });
+  const [idx, setIdx] = useState(0);
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    ui.setTyping(true);
+    return () => ui.setTyping(false);
+  }, []);
+  const setField = (key) => (v) => setVals((s) => ({ ...s, [key]: v }));
+  const submit = async () => {
+    if (busy) return;
+    if (idx < FIELDS.length - 1) {
+      setIdx(idx + 1);
+      return;
+    }
+    if (FIELDS.some((f) => !vals[f.key].trim())) {
+      setError(new Error("All four fields are required."));
+      return;
+    }
+    setBusy(true);
+    setError(null);
+    try {
+      await login({
+        clientId: vals.clientId.trim(),
+        clientSecret: vals.clientSecret.trim(),
+        username: vals.username.trim(),
+        password: vals.password
+      });
+      ui.goBack();
+    } catch (err) {
+      setError(err);
+      setBusy(false);
+    }
+  };
+  useInput((input, key) => {
+    if (busy) return;
+    if (key.escape) ui.goBack();
+    else if (key.tab || key.downArrow) setIdx((i) => (i + 1) % FIELDS.length);
+    else if (key.upArrow) setIdx((i) => (i - 1 + FIELDS.length) % FIELDS.length);
+  });
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx(Header, { title: "Log in to MangaDex", subtitle: "OAuth2 personal client" }),
+    /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "Create a personal client at mangadex.org/settings \u2192 API Clients," }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "then enter its id + secret with your MangaDex login below." }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "(A new client may need staff approval before it works.)" })
+    ] }),
+    FIELDS.map((f, i) => /* @__PURE__ */ jsxs(Box, { children: [
+      /* @__PURE__ */ jsx(Box, { width: 16, children: /* @__PURE__ */ jsx(Text, { color: i === idx ? "cyanBright" : void 0, children: `${i === idx ? "\u203A " : "  "}${f.label}` }) }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: ": " }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          value: vals[f.key],
+          onChange: setField(f.key),
+          onSubmit: submit,
+          focus: i === idx && !busy,
+          mask: f.mask ? "*" : void 0,
+          placeholder: i === idx ? "type\u2026" : ""
+        }
+      )
+    ] }, f.key)),
+    busy ? /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Spinner, { label: "Signing in" }) }) : null,
+    error ? /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(ErrorView, { error }) }) : null,
+    /* @__PURE__ */ jsx(KeyHints, { hints: [["enter", "next / submit"], ["tab \u2191\u2193", "fields"], ["esc", "cancel"]] })
+  ] });
+}
+export {
+  LoginScreen
+};

package/dist/components/screens/MangaScreen.js

@@ -0,0 +1,107 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { Box, Text, useInput } from "ink";
+import { useUI } from "../../ui-context.js";
+import { getSource } from "../../sources/index.js";
+import { getProgress } from "../../state/store.js";
+import { isLoggedIn } from "../../sources/mangadex/auth.js";
+import { chapterLabel } from "../../domain/shape.js";
+import { List } from "../List.js";
+import { Header, Spinner, ErrorView, KeyHints } from "../ui.js";
+import { truncate } from "../../lib/text.js";
+function MangaScreen({ params }) {
+  const { sourceId, manga: initial } = params;
+  const ui = useUI();
+  const source = getSource(sourceId);
+  const [manga, setManga] = useState(initial);
+  const [chapters, setChapters] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const [readSet, setReadSet] = useState(null);
+  const progress = getProgress(initial.key);
+  useEffect(() => {
+    let cancelled = false;
+    const ctrl = new AbortController();
+    setLoading(true);
+    setError(null);
+    (async () => {
+      try {
+        const [full, chRes] = await Promise.all([
+          source.getManga(initial.id, { signal: ctrl.signal }).catch(() => initial),
+          source.listChapters(initial.id, { signal: ctrl.signal, limit: 500 })
+        ]);
+        if (cancelled) return;
+        setManga(full);
+        setChapters(chRes.data);
+        if (isLoggedIn() && source.getReadMarkers) {
+          source.getReadMarkers(initial.id, { signal: ctrl.signal }).then((ids) => {
+            if (!cancelled) setReadSet(new Set(ids));
+          }).catch(() => {
+          });
+        }
+      } catch (err) {
+        if (!cancelled) setError(err);
+      } finally {
+        if (!cancelled) setLoading(false);
+      }
+    })();
+    return () => {
+      cancelled = true;
+      ctrl.abort();
+    };
+  }, [initial.key]);
+  const openAt = (index, startPage = 0) => ui.openReader({ sourceId, manga, chapters, chapterIndex: index, startPage });
+  const resume = () => {
+    if (!progress) return;
+    const idx = chapters.findIndex((c) => c.id === progress.chapterId);
+    if (idx >= 0) openAt(idx, progress.page || 0);
+  };
+  useInput((input) => {
+    if (input === "r" && progress && chapters.length) resume();
+  });
+  const cols = ui.dimensions.cols || 80;
+  const resumeChapterId = progress?.chapterId;
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx(
+      Header,
+      {
+        title: truncate(manga.title, cols - 4),
+        subtitle: [manga.authors?.join(", "), manga.status].filter(Boolean).join(" \xB7 ")
+      }
+    ),
+    manga.tags?.length ? /* @__PURE__ */ jsx(Text, { color: "blue", children: truncate(manga.tags.join(" \xB7 "), cols - 4) }) : null,
+    manga.description ? /* @__PURE__ */ jsx(Box, { marginTop: 1, width: cols - 4, children: /* @__PURE__ */ jsx(Text, { dimColor: true, wrap: "truncate-end", children: truncate(manga.description.replace(/\s+/g, " "), (cols - 4) * 3) }) }) : null,
+    progress ? /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { color: "green", children: `\u25B6 Resume Ch.${progress.chapterNumber ?? "?"} p.${(progress.page || 0) + 1}  (press r)` }) }) : null,
+    /* @__PURE__ */ jsxs(Box, { marginTop: 1, flexDirection: "column", children: [
+      /* @__PURE__ */ jsx(Text, { bold: true, children: `Chapters ${chapters.length ? `(${chapters.length})` : ""}` }),
+      loading ? /* @__PURE__ */ jsx(Spinner, { label: "Loading chapters" }) : null,
+      error ? /* @__PURE__ */ jsx(ErrorView, { error }) : null,
+      !loading && !error ? /* @__PURE__ */ jsx(
+        List,
+        {
+          items: chapters,
+          height: Math.max(4, (ui.dimensions.rows || 24) - 12),
+          onSelect: (_c, index) => openAt(index),
+          emptyText: "No chapters available in this language (try changing language in Settings).",
+          renderItem: (ch, active) => {
+            const isResume = ch.id === resumeChapterId;
+            const read = readSet?.has(ch.id);
+            return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
+              Text,
+              {
+                inverse: active,
+                color: active ? "cyanBright" : isResume ? "green" : void 0,
+                dimColor: !active && read && !isResume,
+                children: ` ${isResume ? "\u25B6 " : read ? "\u2713 " : "  "}${truncate(chapterLabel(ch), cols - 8)} `
+              }
+            ) }, ch.id);
+          }
+        }
+      ) : null
+    ] }),
+    /* @__PURE__ */ jsx(KeyHints, { hints: [["\u2191\u2193", "move"], ["enter", "read"], ...progress ? [["r", "resume"]] : [], ["esc", "back"]] })
+  ] });
+}
+export {
+  MangaScreen
+};

package/dist/components/screens/ReaderScreen.js

@@ -0,0 +1,195 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef, useMemo } from "react";
+import { Box, Text, useInput } from "ink";
+import { useUI } from "../../ui-context.js";
+import { getSource } from "../../sources/index.js";
+import { setProgress, getConfig } from "../../state/store.js";
+import { chapterLabel } from "../../domain/shape.js";
+import { renderInline, imageSize } from "../../render/image.js";
+import { pickInlineBackend, RENDERER_CYCLE } from "../../render/detect.js";
+import { Spinner, ErrorView, KeyHints } from "../ui.js";
+import { truncate } from "../../lib/text.js";
+function ReaderScreen({ params }) {
+  const { sourceId, manga, chapters, chapterIndex: startChapter, startPage = 0 } = params;
+  const ui = useUI();
+  const source = getSource(sourceId);
+  const { cols, rows } = ui.dimensions;
+  const [chapterIndex, setChapterIndex] = useState(startChapter);
+  const [pages, setPages] = useState(null);
+  const [pageIndex, setPageIndex] = useState(startPage);
+  const [scroll, setScroll] = useState(0);
+  const [rendered, setRendered] = useState(null);
+  const [status, setStatus] = useState("loading");
+  const [error, setError] = useState(null);
+  const [fitMode, setFitMode] = useState(false);
+  const [rendererPref, setRendererPref] = useState(getConfig().renderer || "auto");
+  const chapter = chapters[chapterIndex];
+  const viewportRows = Math.max(3, rows - 3);
+  const renderCache = useRef(/* @__PURE__ */ new Map());
+  const backend = useMemo(() => pickInlineBackend({ renderer: rendererPref }), [rendererPref]);
+  useEffect(() => {
+    let cancelled = false;
+    const ctrl = new AbortController();
+    setStatus("loading");
+    setPages(null);
+    setError(null);
+    (async () => {
+      try {
+        const pgs = await source.getPages(chapter.id, { signal: ctrl.signal });
+        if (cancelled) return;
+        setPages(pgs);
+        setPageIndex((p) => Math.max(0, Math.min(p, pgs.length - 1)));
+      } catch (err) {
+        if (!cancelled) {
+          setError(err);
+          setStatus("error");
+        }
+      }
+    })();
+    return () => {
+      cancelled = true;
+      ctrl.abort();
+    };
+  }, [chapter?.id]);
+  const cacheKeyFor = (idx) => `${chapter?.id}:${idx}:${cols}:${viewportRows}:${backend}:${fitMode ? "fit" : "scroll"}`;
+  const renderPage = async (idx, signal) => {
+    const key = cacheKeyFor(idx);
+    if (renderCache.current.has(key)) return renderCache.current.get(key);
+    const buf = await source.loadPageBuffer(pages[idx], { signal });
+    let renderCols = cols;
+    if (fitMode) {
+      const { width, height } = await imageSize(buf);
+      renderCols = Math.max(8, Math.min(cols, Math.floor(viewportRows * 2 * (width / height))));
+    }
+    const out = await renderInline(buf, { cols: renderCols, backend });
+    renderCache.current.set(key, out);
+    return out;
+  };
+  const prefetchers = useRef(/* @__PURE__ */ new Set());
+  useEffect(() => () => {
+    for (const c of prefetchers.current) c.abort();
+    prefetchers.current.clear();
+  }, []);
+  const prefetch = (idx) => {
+    if (!pages?.[idx] || renderCache.current.has(cacheKeyFor(idx))) return;
+    const c = new AbortController();
+    prefetchers.current.add(c);
+    renderPage(idx, c.signal).catch(() => {
+    }).finally(() => prefetchers.current.delete(c));
+  };
+  useEffect(() => {
+    if (!pages || !pages[pageIndex]) return;
+    let cancelled = false;
+    const ctrl = new AbortController();
+    if (renderCache.current.has(cacheKeyFor(pageIndex))) {
+      setRendered(renderCache.current.get(cacheKeyFor(pageIndex)));
+      setScroll(0);
+      setStatus("ready");
+    } else {
+      setStatus("loading");
+      renderPage(pageIndex, ctrl.signal).then((out) => {
+        if (cancelled) return;
+        setRendered(out);
+        setScroll(0);
+        setStatus("ready");
+      }).catch((err) => {
+        if (!cancelled && !ctrl.signal.aborted) {
+          setError(err);
+          setStatus("error");
+        }
+      });
+    }
+    prefetch(pageIndex + 1);
+    return () => {
+      cancelled = true;
+      ctrl.abort();
+    };
+  }, [pages, pageIndex, cols, viewportRows, backend, fitMode]);
+  useEffect(() => {
+    if (status !== "ready" || !pages) return;
+    setProgress(manga.key, {
+      source: sourceId,
+      mangaId: manga.id,
+      mangaTitle: manga.title,
+      chapterId: chapter.id,
+      chapterNumber: chapter.number,
+      page: pageIndex
+    });
+    if (pageIndex === pages.length - 1 && source.syncChapterRead) {
+      source.syncChapterRead(manga.id, chapter.id);
+    }
+  }, [pageIndex, chapter?.id, status]);
+  const lines = rendered?.lines || [];
+  const maxScroll = Math.max(0, lines.length - viewportRows);
+  const changeChapter = (delta) => {
+    const next = chapterIndex + delta;
+    if (next < 0 || next >= chapters.length) return;
+    setChapterIndex(next);
+    setPageIndex(0);
+    setScroll(0);
+  };
+  const nextPage = () => {
+    if (pages && pageIndex < pages.length - 1) {
+      setPageIndex(pageIndex + 1);
+      setScroll(0);
+    } else {
+      changeChapter(1);
+    }
+  };
+  const prevPage = () => {
+    if (pageIndex > 0) {
+      setPageIndex(pageIndex - 1);
+      setScroll(0);
+    } else {
+      changeChapter(-1);
+    }
+  };
+  const cycleRenderer = () => {
+    const i = RENDERER_CYCLE.indexOf(rendererPref);
+    setRendererPref(RENDERER_CYCLE[(i + 1) % RENDERER_CYCLE.length]);
+  };
+  useInput((input, key) => {
+    if (key.downArrow || input === "j") setScroll((s) => Math.min(maxScroll, s + 1));
+    else if (key.upArrow || input === "k") setScroll((s) => Math.max(0, s - 1));
+    else if (input === " " || key.pageDown) {
+      if (scroll >= maxScroll) nextPage();
+      else setScroll((s) => Math.min(maxScroll, s + viewportRows - 1));
+    } else if (key.pageUp) setScroll((s) => Math.max(0, s - (viewportRows - 1)));
+    else if (key.rightArrow || input === "l" || input === "n") nextPage();
+    else if (key.leftArrow || input === "h" || input === "p") prevPage();
+    else if (input === "g") setScroll(0);
+    else if (input === "G") setScroll(maxScroll);
+    else if (input === "N") changeChapter(1);
+    else if (input === "P") changeChapter(-1);
+    else if (input === "f") setFitMode((f) => !f);
+    else if (input === "r") cycleRenderer();
+  });
+  const pageLabel = pages ? `${pageIndex + 1}/${pages.length}` : "\u2026";
+  const slice = lines.slice(scroll, scroll + viewportRows);
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsxs(Box, { justifyContent: "space-between", children: [
+      /* @__PURE__ */ jsx(Text, { color: "magentaBright", bold: true, children: truncate(manga.title, Math.max(10, cols - 34)) }),
+      /* @__PURE__ */ jsx(Text, { children: `${truncate(chapterLabel(chapter), 24)} \xB7 ${pageLabel}${fitMode ? " \xB7 fit" : ""}` })
+    ] }),
+    /* @__PURE__ */ jsx(Box, { height: viewportRows, flexDirection: "column", children: status === "loading" ? /* @__PURE__ */ jsx(Spinner, { label: pages ? `Rendering page ${pageIndex + 1}` : "Loading chapter" }) : status === "error" ? /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+      /* @__PURE__ */ jsx(ErrorView, { error }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "Press N / P to skip to another chapter, or Esc to go back." })
+    ] }) : slice.map((ln, i) => /* @__PURE__ */ jsx(Text, { wrap: "truncate-end", children: ln }, scroll + i)) }),
+    /* @__PURE__ */ jsx(
+      KeyHints,
+      {
+        hints: [
+          ["\u2190\u2192", "page"],
+          ["\u2191\u2193", "scroll"],
+          ["N/P", "chapter"],
+          ["f", fitMode ? "scroll" : "fit"],
+          ["r", `render:${rendererPref}`],
+          ["esc", "back"]
+        ]
+      }
+    )
+  ] });
+}
+export {
+  ReaderScreen
+};

package/dist/components/screens/SearchScreen.js

@@ -0,0 +1,111 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef } from "react";
+import { Box, Text, useInput } from "ink";
+import TextInput from "ink-text-input";
+import { useUI } from "../../ui-context.js";
+import { getSource } from "../../sources/index.js";
+import { List } from "../List.js";
+import { Header, Spinner, ErrorView, KeyHints } from "../ui.js";
+import { truncate } from "../../lib/text.js";
+const PAGE = 20;
+function SearchScreen({ params }) {
+  const { sourceId, mode } = params;
+  const ui = useUI();
+  const source = getSource(sourceId);
+  const [query, setQuery] = useState("");
+  const [submitted, setSubmitted] = useState(mode === "browse" ? "" : null);
+  const [results, setResults] = useState([]);
+  const [pagination, setPagination] = useState(null);
+  const [loading, setLoading] = useState(mode === "browse");
+  const [error, setError] = useState(null);
+  const [focusInput, setFocusInput] = useState(mode !== "browse");
+  useEffect(() => {
+    ui.setTyping(focusInput);
+    return () => ui.setTyping(false);
+  }, [focusInput]);
+  const reqId = useRef(0);
+  const fetchPage = async (q, offset, append) => {
+    const id = ++reqId.current;
+    const ctrl = new AbortController();
+    setLoading(true);
+    setError(null);
+    try {
+      const res = await source.search(q, { offset, limit: PAGE, signal: ctrl.signal });
+      if (id !== reqId.current) return;
+      setResults((prev) => append ? [...prev, ...res.data] : res.data);
+      setPagination(res.pagination);
+    } catch (err) {
+      if (id === reqId.current) setError(err);
+    } finally {
+      if (id === reqId.current) setLoading(false);
+    }
+  };
+  useEffect(() => {
+    if (mode === "browse") fetchPage("", 0, false);
+  }, []);
+  const onSubmit = () => {
+    setSubmitted(query);
+    setFocusInput(false);
+    fetchPage(query, 0, false);
+  };
+  const loadMore = () => {
+    if (loading || !pagination?.hasMore) return;
+    fetchPage(submitted ?? "", pagination.offset + pagination.limit, true);
+  };
+  const onHighlight = (_item, index) => {
+    if (index >= results.length - 2) loadMore();
+  };
+  useInput((input, key) => {
+    if (!focusInput && input === "/") setFocusInput(true);
+    else if (focusInput && key.escape) setFocusInput(false);
+  });
+  const listHeight = Math.max(4, (ui.dimensions.rows || 24) - 9);
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx(
+      Header,
+      {
+        title: source.label,
+        subtitle: sourceId === "local" ? "filter your local library" : "search the online catalog"
+      }
+    ),
+    /* @__PURE__ */ jsxs(Box, { children: [
+      /* @__PURE__ */ jsx(Text, { color: focusInput ? "cyanBright" : "gray", children: focusInput ? "\u203A " : "  " }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          value: query,
+          onChange: setQuery,
+          onSubmit,
+          focus: focusInput,
+          placeholder: sourceId === "local" ? "type to filter\u2026" : "type a title, enter to search\u2026"
+        }
+      )
+    ] }),
+    loading ? /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Spinner, { label: "Loading" }) }) : null,
+    error ? /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(ErrorView, { error }) }) : null,
+    !error && submitted !== null ? /* @__PURE__ */ jsx(Box, { flexDirection: "column", marginTop: 1, children: /* @__PURE__ */ jsx(
+      List,
+      {
+        items: results,
+        isActive: !focusInput,
+        height: listHeight,
+        onSelect: (m) => ui.navigate("manga", { sourceId, manga: m }),
+        onHighlight,
+        emptyText: loading ? " " : submitted === "" ? "Nothing found." : `No results for "${submitted}".`,
+        renderItem: (m, active) => /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Text, { inverse: active, color: active ? "cyanBright" : void 0, children: ` ${truncate(m.title, Math.max(20, (ui.dimensions.cols || 80) - 24))} ` }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  ${m.source === "local" ? `${m.chaptersCount ?? "?"} ch` : m.status || ""}` })
+        ] }, m.key)
+      }
+    ) }) : null,
+    /* @__PURE__ */ jsx(
+      KeyHints,
+      {
+        hints: focusInput ? [["enter", "search"], ["esc", "to results"]] : [["\u2191\u2193", "move"], ["enter", "open"], ["/", "search"], ["esc", "back"]]
+      }
+    )
+  ] });
+}
+export {
+  SearchScreen
+};