@open-press/core 1.1.4 → 1.2.1

package/src/openpress/workbench/actions/SearchControl.tsx

@@ -1,43 +1,15 @@
 import { useCallback, useEffect, useId, useMemo, useRef, useState, type FormEvent } from "react";
 import { FileText, Loader2, Search } from "lucide-react";
 import type { SourceBlock } from "../../document-model";
+import type { SearchReport, SearchScope } from "../../shared";
 import { WorkbenchDialog } from "../dialog";
 
-type SearchScope = "content" | "all";
 type SearchStatus = "idle" | "loading" | "success" | "error";
 const SEARCH_SCOPE: SearchScope = "all";
 const LIVE_SEARCH_DEBOUNCE_MS = 280;
 
-type SearchFile = {
-  scope: string;
-  file: string;
-  path: string;
-  matchCount: number;
-};
-
-type SearchMatch = {
-  id: string;
-  scope: string;
-  file: string;
-  path: string;
-  line: number;
-  column: number;
-  index: number;
-  text: string;
-  preview: string;
-};
-
-type SearchReport = {
-  ok?: boolean;
-  kind: "search";
-  query: string;
-  scope: SearchScope;
-  caseSensitive: boolean;
-  matchCount: number;
-  files: Array<SearchFile>;
-  matches: Array<SearchMatch>;
-  message?: string;
-};
+type SearchFile = SearchReport["files"][number];
+type SearchMatch = SearchReport["matches"][number];
 
 type SearchJumpTarget = {
   blockId: string;
@@ -45,12 +17,37 @@ type SearchJumpTarget = {
   pageNumber: number;
 };
 
+export interface SearchControlSearcherArgs {
+  query: string;
+  scope: SearchScope;
+  signal: AbortSignal;
+}
+
+export type SearchControlSearcher = (args: SearchControlSearcherArgs) => Promise<SearchReport>;
+
+// Default searcher: hits the dev-only /__openpress/search endpoint.
+// Public deploys override this via the `searcher` prop with a static
+// in-browser searcher backed by /openpress/search-corpus.json.
+async function liveSearcher({ query, scope, signal }: SearchControlSearcherArgs): Promise<SearchReport> {
+  const params = new URLSearchParams();
+  params.set("q", query);
+  params.set("scope", scope);
+  const response = await fetch(`/__openpress/search?${params.toString()}`, { cache: "no-store", signal });
+  const data = (await response.json().catch(() => null)) as (Partial<SearchReport> & { message?: string }) | null;
+  if (!response.ok || data?.ok === false || !isSearchReport(data)) {
+    throw new Error(data?.message ?? "搜尋失敗。");
+  }
+  return data;
+}
+
 export function SearchControl({
   sourceBlocksByPath = {},
   onSelectPage,
+  searcher = liveSearcher,
 }: {
   sourceBlocksByPath?: Record<string, SourceBlock[]>;
   onSelectPage?: (pageIndex: number, options?: { behavior?: ScrollBehavior }) => void;
+  searcher?: SearchControlSearcher;
 }) {
   const titleId = useId();
   const [open, setOpen] = useState(false);
@@ -98,26 +95,18 @@ export function SearchControl({
     setError("");
 
     try {
-      const params = new URLSearchParams();
-      params.set("q", trimmedQuery);
-      params.set("scope", SEARCH_SCOPE);
-      const response = await fetch(`/__openpress/search?${params.toString()}`, {
-        cache: "no-store",
-        signal: controller.signal,
-      });
-      const data = await response.json().catch(() => null) as (Partial<SearchReport> & { message?: string }) | null;
+      const data = await searcher({ query: trimmedQuery, scope: SEARCH_SCOPE, signal: controller.signal });
       if (controller.signal.aborted || requestId !== searchRequestIdRef.current) return;
-      if (!response.ok || data?.ok === false || !isSearchReport(data)) {
-        throw new Error(data?.message ?? "搜尋失敗。");
-      }
+      if (!isSearchReport(data)) throw new Error("搜尋失敗。");
       setReport(data);
       setStatus("success");
     } catch (searchError) {
       if (controller.signal.aborted || requestId !== searchRequestIdRef.current) return;
+      if (searchError instanceof DOMException && searchError.name === "AbortError") return;
       setError(searchError instanceof Error ? searchError.message : String(searchError));
       setStatus("error");
     }
-  }, []);
+  }, [searcher]);
 
   useEffect(() => {
     if (!open) return undefined;

package/src/openpress/workbench/actions/index.ts

@@ -1,6 +1,6 @@
 export * from "./deploymentStatusModel";
 export * from "./DeploymentControl";
-export * from "./ExportImageControl";
+export * from "./ExportControl";
 export * from "./PageZoomControl";
 export * from "./SearchControl";
 export * from "./useDeploymentWorkbench";

package/src/openpress/workbench/actions/useDeploymentWorkbench.ts

@@ -6,6 +6,12 @@ import { parseDeployError, workbenchPdfButtonText, workbenchPdfStatusMessage } f
 
 export interface UseDeploymentWorkbenchOptions {
   deploymentInfo: DeploymentInfo;
+  // Active Press slug — when present the local PDF export endpoint
+  // tells the CLI to export this Press (open-press pdf . --press <slug>)
+  // instead of defaulting to the first Press. Empty / null means the
+  // workspace has only one Press, or the workbench is at the gallery
+  // root, and the CLI default is correct.
+  pressSlug?: string | null;
 }
 
 export interface DeploymentWorkbench {
@@ -22,7 +28,7 @@ export interface DeploymentWorkbench {
   handleOpenWorkbenchPdf: () => void;
 }
 
-export function useDeploymentWorkbench({ deploymentInfo }: UseDeploymentWorkbenchOptions): DeploymentWorkbench {
+export function useDeploymentWorkbench({ deploymentInfo, pressSlug = null }: UseDeploymentWorkbenchOptions): DeploymentWorkbench {
   const [status, setStatus] = useState<DeployStatus>("idle");
   const [pdfActionStatus, setPdfActionStatus] = useState<PdfActionStatus>("idle");
   const [currentDeploymentInfo, setCurrentDeploymentInfo] = useState(deploymentInfo);
@@ -48,7 +54,12 @@ export function useDeploymentWorkbench({ deploymentInfo }: UseDeploymentWorkbenc
     }
     setStatus("deploying");
     try {
-      const response = await fetch("/__openpress/deploy", { method: "POST" });
+      const requestBody = pressSlug ? { press: pressSlug } : {};
+      const response = await fetch("/__openpress/deploy", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(requestBody),
+      });
       if (response.status === 404 || response.status === 405) {
         setStatus("unavailable");
         return;
@@ -90,13 +101,18 @@ export function useDeploymentWorkbench({ deploymentInfo }: UseDeploymentWorkbenc
       console.error("OpenPress deploy unavailable", error);
       setStatus("unavailable");
     }
-  }, [status, currentDeploymentInfo.configured]);
+  }, [status, currentDeploymentInfo.configured, pressSlug]);
 
   const handleOpenLatestLocalPdf = useCallback(async () => {
     if (pdfActionStatus === "generating") return;
     setPdfActionStatus("generating");
     try {
-      const response = await fetch("/__openpress/local-pdf-export", { method: "POST" });
+      const requestBody = pressSlug ? { press: pressSlug } : {};
+      const response = await fetch("/__openpress/local-pdf-export", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(requestBody),
+      });
       if (!response.ok) {
         const text = await response.text().catch(() => "");
         throw new Error(text || `Local PDF export failed with status ${response.status}`);
@@ -109,7 +125,7 @@ export function useDeploymentWorkbench({ deploymentInfo }: UseDeploymentWorkbenc
       console.error("OpenPress local PDF export failed", error);
       setPdfActionStatus("failed");
     }
-  }, [pdfActionStatus]);
+  }, [pdfActionStatus, pressSlug]);
 
   const handleOpenWorkbenchPdf = useCallback(() => {
     if (localDeployEnabled) {

package/src/openpress/workbench/hooks/useWorkbenchNavigation.ts

@@ -0,0 +1,42 @@
+import { useCallback } from "react";
+import { resolveAnchorPageIndex } from "../../document-model";
+import { PUBLIC_DRAWER_BREAKPOINT, type DisplayPage } from "../../reader";
+
+type SetPage = (pageIndex: number, options?: { behavior?: ScrollBehavior }) => void;
+
+export function useWorkbenchNavigation({
+  anchorPageMap,
+  pages,
+  rightPanelOpen,
+  setPage,
+  toggleRightPanel,
+}: {
+  anchorPageMap: Map<string, number>;
+  pages: DisplayPage[];
+  rightPanelOpen: boolean;
+  setPage: SetPage;
+  toggleRightPanel: () => void;
+}) {
+  const selectWorkspacePage = useCallback((pageIndex: number, options?: { behavior?: ScrollBehavior }) => {
+    setPage(pageIndex, options);
+    if (
+      typeof window !== "undefined"
+      && window.innerWidth < PUBLIC_DRAWER_BREAKPOINT
+      && rightPanelOpen
+    ) {
+      toggleRightPanel();
+    }
+  }, [rightPanelOpen, setPage, toggleRightPanel]);
+
+  const selectWorkspaceAnchor = useCallback((anchorId: string, pageIndex?: number) => {
+    const targetPageIndex = resolveAnchorPageIndex(anchorPageMap, pages.length, anchorId, pageIndex);
+    if (targetPageIndex === null) return false;
+    selectWorkspacePage(targetPageIndex, { behavior: "smooth" });
+    return true;
+  }, [anchorPageMap, pages.length, selectWorkspacePage]);
+
+  return {
+    selectWorkspaceAnchor,
+    selectWorkspacePage,
+  };
+}

package/src/openpress/workbench/inspector/useInspectorComments.ts

@@ -8,7 +8,7 @@ import type { InspectorState, PendingComment } from "./inspectorModel";
 import { getInlineSavedCommentForTarget, resolveInlineSavedComment } from "./inlineCommentModel";
 
 export interface UseInspectorCommentsOptions {
-  devMode: boolean;
+  workspaceMode: boolean;
   inspector: InspectorState;
   sourceBlockMap: Record<string, SourceBlock>;
   sourceBlocksByPath: Record<string, SourceBlock[]>;
@@ -36,7 +36,7 @@ export interface InspectorComments {
 }
 
 export function useInspectorComments({
-  devMode,
+  workspaceMode,
   inspector,
   sourceBlockMap,
   sourceBlocksByPath,
@@ -76,7 +76,7 @@ export function useInspectorComments({
   );
 
   const refreshPendingComments = useCallback(async () => {
-    if (!devMode) return;
+    if (!workspaceMode) return;
     setCommentsStatus("loading");
     setCommentsError("");
     try {
@@ -87,7 +87,7 @@ export function useInspectorComments({
       setCommentsStatus("failed");
       setCommentsError(error instanceof Error ? error.message : String(error));
     }
-  }, [devMode]);
+  }, [workspaceMode]);
 
   const clearPendingComment = useCallback(async (id: string) => {
     setCommentsStatus("clearing");
@@ -225,9 +225,9 @@ export function useInspectorComments({
 
   // Initial + dev-mode refresh of pending comments.
   useEffect(() => {
-    if (!devMode) return;
+    if (!workspaceMode) return;
     void refreshPendingComments();
-  }, [devMode, refreshPendingComments]);
+  }, [workspaceMode, refreshPendingComments]);
 
   return {
     pendingComments,

package/src/openpress/workbench/project/ProjectEntryPanel.tsx

@@ -1,7 +1,6 @@
-import { memo, useState, type CSSProperties } from "react";
-import { Component as ComponentIcon, Images, Palette, type LucideIcon } from "lucide-react";
+import { memo, useState } from "react";
+import { Component as ComponentIcon } from "lucide-react";
 import type { BookmarkItem, BookmarkSubItem, MediaAssetItem } from "../../document-model";
-import { projectSourceDirectoryPath, PROJECT_SOURCES } from "./projectSourceModel";
 import type { BlockSource } from "../../document-model";
 import type { DisplayPage } from "../../reader";
 import { Panel } from "../panels/Panel";
@@ -15,10 +14,6 @@ import {
 export { createProjectObjectEntityId } from "./projectPreviewTypes";
 export type { ProjectMentionItem, ProjectPanelPreview } from "./projectPreviewTypes";
 
-export const PROJECT_VISUAL_SYSTEM_KEY = "visual-system";
-export const PROJECT_IMAGE_GALLERY_KEY = "image-gallery";
-export const PROJECT_COMPONENT_LIBRARY_KEY = "component-library";
-
 export type ProjectComponentUsage = {
   count: number;
   pageIndexes: number[];
@@ -167,264 +162,6 @@ function ProjectEntryPanelImpl({
 export const ProjectEntryPanel = memo(ProjectEntryPanelImpl);
 ProjectEntryPanel.displayName = "ProjectEntryPanel";
 
-export function ProjectPreviewPanel({
-  mediaAssets,
-  componentUsages,
-  selectedKey,
-}: {
-  mediaAssets: MediaAssetItem[];
-  componentUsages: Map<string, ProjectComponentUsage>;
-  selectedKey: string | null;
-}) {
-  if (!selectedKey || selectedKey === PROJECT_VISUAL_SYSTEM_KEY) {
-    return <ProjectVisualSystem />;
-  }
-
-  if (selectedKey === PROJECT_IMAGE_GALLERY_KEY) {
-    return <ProjectImageGallery mediaAssets={mediaAssets} />;
-  }
-
-  if (selectedKey === PROJECT_COMPONENT_LIBRARY_KEY) {
-    return <ProjectComponentLibrary usages={componentUsages} />;
-  }
-
-  return <ProjectVisualSystem />;
-}
-
-function ProjectPanelButton({
-  icon: Icon,
-  label,
-  meta,
-  active,
-  onClick,
-}: {
-  icon: LucideIcon;
-  label: string;
-  meta: string;
-  active: boolean;
-  onClick: () => void;
-}) {
-  return (
-    <button
-      type="button"
-      className={`bookmark-item bookmark-h2 openpress-project-entry${active ? " is-active" : ""}`}
-      aria-pressed={active}
-      onClick={onClick}
-    >
-      <span className="bookmark-index openpress-project-entry-icon"><Icon aria-hidden="true" /></span>
-      <span className="bookmark-title">
-        <span>{label}</span>
-        <small>{meta}</small>
-      </span>
-    </button>
-  );
-}
-
-function ProjectVisualSystem() {
-  return (
-    <section className="openpress-project-preview-panel" aria-label="專案">
-      <article className="openpress-project-visual-system" aria-label="Visual System">
-        <ProjectSectionHeader title="Visual System" minimal />
-
-        <div className="openpress-project-visual-grid">
-          <section className="openpress-project-visual-card openpress-project-visual-card--typography" aria-label="Typography">
-            <header>
-              <span>Typography</span>
-              <strong>閱讀層級</strong>
-            </header>
-            <div className="openpress-project-type-specimen">
-              <p className="openpress-project-type-kicker">Course Notes</p>
-              <h2>Data Structures</h2>
-              <h3>Linked List 與 Tree Traversal</h3>
-              <h4>Pointer / Node / Recursive Thinking</h4>
-              <p>以 C/C++ 實作資料結構，整理概念、表示法與操作流程。</p>
-              <code>struct Node *next = head;</code>
-            </div>
-          </section>
-
-          <section className="openpress-project-visual-card" aria-label="Color Palette">
-            <header>
-              <span>Palette</span>
-              <strong>色票配置</strong>
-            </header>
-            <div className="openpress-project-swatch-grid">
-              {PROJECT_COLOR_SWATCHES.map((item) => (
-                <div className="openpress-project-swatch" key={item.token}>
-                  <span
-                    className="openpress-project-swatch-chip"
-                    style={{ "--openpress-project-swatch": `var(${item.token})` } as CSSProperties}
-                    aria-hidden="true"
-                  />
-                  <strong>{item.label}</strong>
-                  <code>{item.token.replace("--openpress-", "")}</code>
-                </div>
-              ))}
-            </div>
-          </section>
-
-          <section className="openpress-project-visual-card openpress-project-visual-card--surfaces" aria-label="Surfaces">
-            <header>
-              <span>Surfaces</span>
-              <strong>區塊背景</strong>
-            </header>
-            <div className="openpress-project-surface-preview">
-              <div className="openpress-project-surface-paper">
-                <span>Page paper</span>
-              </div>
-              <div className="openpress-project-surface-block">
-                <span>Figure / Code block</span>
-              </div>
-            </div>
-          </section>
-        </div>
-      </article>
-    </section>
-  );
-}
-
-function ProjectComponentLibrary({
-  usages,
-}: {
-  usages: Map<string, ProjectComponentUsage>;
-}) {
-  const previewItems = createComponentPreviewItems(usages);
-  return (
-    <section className="openpress-project-preview-panel" aria-label="專案">
-      <article className="openpress-project-component-viewer" aria-label={PROJECT_SOURCES.components.label}>
-        <ProjectSectionHeader
-          title="Rendered Components"
-          description="文件目前實際渲染出的 component、圖表與示意圖狀態。"
-          stats={[
-            ["Kinds", String(usages.size)],
-            ["Renders", String(previewItems.length)],
-          ]}
-        />
-        {previewItems.length > 0 ? (
-          <div className="openpress-project-component-list" aria-label="rendered content block list">
-            {previewItems.map((item) => (
-              <figure className="openpress-project-component-preview-row" key={`${item.name}-${item.index}`}>
-                <figcaption>
-                  <span>{item.name}</span>
-                  <small>P{String(item.preview.pageIndex + 1).padStart(2, "0")}</small>
-                </figcaption>
-                <div
-                  className="openpress-project-component-preview"
-                  dangerouslySetInnerHTML={{ __html: item.preview.html }}
-                />
-              </figure>
-            ))}
-          </div>
-        ) : (
-          <p className="openpress-project-empty">目前文件尚未渲染任何內容區塊。</p>
-        )}
-      </article>
-    </section>
-  );
-}
-
-function ProjectImageGallery({
-  mediaAssets,
-}: {
-  mediaAssets: MediaAssetItem[];
-}) {
-  const usedCount = mediaAssets.filter((item) => item.usageCount > 0).length;
-  const unreferencedAssets = mediaAssets.filter((item) => item.usageCount === 0);
-  const referencedAssets = mediaAssets.filter((item) => item.usageCount > 0);
-  return (
-    <section className="openpress-project-preview-panel" aria-label="專案">
-      <article className="openpress-project-gallery-viewer" aria-label="Image Gallery">
-        <ProjectSectionHeader
-          title="Media Library"
-          description={projectSourceDirectoryPath("media")}
-          stats={[
-            ["Files", String(mediaAssets.length)],
-            ["Used", String(usedCount)],
-          ]}
-        />
-        {mediaAssets.length > 0 ? (
-          <div className="openpress-project-media-sections" aria-label="media gallery">
-            <ProjectMediaSection title="未引用" assets={unreferencedAssets} />
-            <ProjectMediaSection title="已引用" assets={referencedAssets} />
-          </div>
-        ) : (
-          <p className="openpress-project-empty">{projectSourceDirectoryPath("media")} 尚未有可預覽素材。</p>
-        )}
-      </article>
-    </section>
-  );
-}
-
-function ProjectSectionHeader({
-  title,
-  description,
-  stats,
-  minimal = false,
-}: {
-  title: string;
-  description?: string;
-  stats?: Array<[string, string]>;
-  minimal?: boolean;
-}) {
-  return (
-    <header className={`openpress-project-section-header${minimal ? " openpress-project-section-header--minimal" : ""}`}>
-      <div>
-        <h2>{title}</h2>
-        {description ? <span>{description}</span> : null}
-      </div>
-      {!minimal && stats?.length ? (
-        <dl>
-          {stats.map(([label, value]) => (
-            <div key={label}>
-              <dt>{label}</dt>
-              <dd>{value}</dd>
-            </div>
-          ))}
-        </dl>
-      ) : null}
-    </header>
-  );
-}
-
-function ProjectMediaSection({
-  title,
-  assets,
-}: {
-  title: string;
-  assets: MediaAssetItem[];
-}) {
-  return (
-    <section className="openpress-project-media-section" aria-label={title}>
-      <header className="openpress-project-media-section-header">
-        <h3>{title}</h3>
-      </header>
-      {assets.length > 0 ? (
-        <div className="openpress-project-media-gallery">
-          {assets.map((item) => (
-            <figure className="openpress-project-media-card" data-unused={item.usageCount === 0 ? "true" : "false"} key={item.id}>
-              <img src={item.src} alt="" loading="lazy" />
-              <figcaption>
-                <strong>{item.fileName}</strong>
-              </figcaption>
-            </figure>
-          ))}
-        </div>
-      ) : (
-        <p className="openpress-project-media-section-empty">沒有{title}圖片。</p>
-      )}
-    </section>
-  );
-}
-
-function createComponentPreviewItems(usages: Map<string, ProjectComponentUsage>) {
-  return Array.from(usages.entries())
-    .flatMap(([name, usage]) => usage.previews.map((preview, index) => ({ name, preview, index })))
-    .filter((item) => Boolean(item.preview.html))
-    .sort((a, b) => {
-      const pageDelta = a.preview.pageIndex - b.preview.pageIndex;
-      return pageDelta || a.name.localeCompare(b.name, "zh-Hant") || a.index - b.index;
-    });
-}
-
 function extractRenderedComponentBlocks(html: string) {
   const blocks: Array<{ name: string; html: string }> = [];
   const openTagPattern = /<(figure|section|article|div)\b[^>]*data-openpress-component="([^"]+)"[^>]*>/g;
@@ -510,16 +247,3 @@ const PROJECT_SKILL_MENTIONS: ProjectMentionItem[] = [
   { trigger: "/", value: "/apply-style", label: "apply-style", meta: "skill", kind: "skill" },
   { trigger: "/", value: "/fix-code", label: "fix-code", meta: "skill", kind: "skill" },
 ];
-
-const PROJECT_COLOR_SWATCHES = [
-  { label: "Document", token: "--openpress-color-document" },
-  { label: "Paper", token: "--openpress-color-paper" },
-  { label: "Ink", token: "--openpress-color-ink" },
-  { label: "Body", token: "--openpress-color-body" },
-  { label: "Muted", token: "--openpress-color-muted" },
-  { label: "Subtle", token: "--openpress-color-subtle" },
-  { label: "Line", token: "--openpress-color-line" },
-  { label: "Block", token: "--openpress-color-block" },
-  { label: "Info", token: "--openpress-color-info" },
-  { label: "Green", token: "--openpress-color-green" },
-];