@open-press/core 1.2.0 → 1.3.1

package/src/styles/openpress/workspace-gallery.css

@@ -262,11 +262,6 @@
   white-space: nowrap;
 }
 
-.openpress-workspace-gallery__dot {
-  color: color-mix(in srgb, var(--workspace-card-muted) 55%, transparent);
-}
-
-.openpress-workspace-gallery__pages,
 .openpress-workspace-gallery__geom {
   color: var(--workspace-card-muted);
 }

package/src/styles/openpress.css

@@ -1,9 +1,15 @@
 @import "./openpress/app-shell.css";
 @import "./openpress/workspace-gallery.css";
 @import "./openpress/workbench.css";
+@import "./openpress/slide-presenter.css";
+@import "./openpress/workbench-toolbar.css";
+@import "./openpress/slide-public-viewer.css";
+@import "./openpress/workbench-inline-editor.css";
+@import "./openpress/workbench-dialog.css";
+@import "./openpress/workbench-search.css";
+@import "./openpress/workbench-export.css";
 @import "./openpress/workbench-panels.css";
 @import "./openpress/project-preview-panel.css";
-@import "./openpress/media-workspace.css";
 @import "./openpress/reader-runtime.css";
 @import "./openpress/public-viewer.css";
 @import "./openpress/responsive.css";

package/vite.config.ts

@@ -10,6 +10,7 @@ import { searchSourceText } from "./engine/runtime/source-text-tools.mjs";
 import { handleCommentRequest } from "./engine/react/comment-endpoint.mjs";
 import { handleProjectAssetRequest } from "./engine/react/project-asset-endpoint.mjs";
 import { handleSourceEditRequest } from "./engine/react/source-edit-endpoint.mjs";
+import { exportReactDocument } from "./engine/react/document-export.mjs";
 
 const frameworkRoot = fileURLToPath(new URL("./", import.meta.url));
 const workspaceRoot = process.env.OPENPRESS_WORKSPACE_ROOT
@@ -26,10 +27,7 @@ const openpressConfig = await loadConfig(workspaceRoot);
 const outputDir = openpressConfig.paths.outputDir;
 const reactDocumentRoot = openpressConfig.paths.documentRoot;
 const reactDocumentComponentsRoot = openpressConfig.paths.componentsDir;
-const reactDocumentEntry = path.join(reactDocumentRoot, "index.tsx");
-const activeContentDir = await fileExists(reactDocumentEntry)
-  ? path.join(reactDocumentRoot, "chapters")
-  : openpressConfig.paths.sourceDir;
+const activeContentDir = reactDocumentRoot;
 
 // Workspace directories — Vite resolves these at build time so that
 // `import.meta.glob("@workspace/content/**")` and friends follow the active
@@ -112,6 +110,11 @@ export default defineConfig({
 });
 
 function openpressLocalDeployPlugin() {
+  // Suppress auto-reload when source-edit endpoint triggers an export (avoids double reload).
+  let watcherSuppressedUntil = 0;
+  let debounceTimer: ReturnType<typeof setTimeout> | null = null;
+  let exporting = false;
+
   return {
     name: "openpress-local-deploy-endpoint",
     configureServer(server: { middlewares: { use: (path: string, handler: (req: IncomingMessage, res: ServerResponse) => void) => void } }) {
@@ -128,6 +131,7 @@ function openpressLocalDeployPlugin() {
         void handleLocalSearchRequest(req, res);
       });
       server.middlewares.use("/__openpress/source-edit", (req, res) => {
+        if (req.method === "POST") watcherSuppressedUntil = Date.now() + 5000;
         void handleSourceEditRequest(req, res, { root: workspaceRoot });
       });
       server.middlewares.use("/__openpress/deploy", (req, res) => {
@@ -146,6 +150,31 @@ function openpressLocalDeployPlugin() {
         void handleLocalMediaFileRequest(req, res);
       });
     },
+    async handleHotUpdate({ file, server }: { file: string; server: { ws: { send: (payload: unknown) => void } } }) {
+      // Only react to changes inside the press/document directory.
+      const inDocumentRoot = file.startsWith(reactDocumentRoot + path.sep) || file === reactDocumentRoot;
+      const inContentDir = file.startsWith(activeContentDir + path.sep) || file === activeContentDir;
+      if (!inDocumentRoot && !inContentDir) return;
+
+      // Skip when source-edit already handled the export to avoid a double reload.
+      if (Date.now() < watcherSuppressedUntil) return [];
+
+      if (debounceTimer) clearTimeout(debounceTimer);
+      debounceTimer = setTimeout(async () => {
+        if (exporting) return;
+        exporting = true;
+        try {
+          await exportReactDocument(workspaceRoot, { syncAssets: false });
+        } catch {
+          // Export failure must not crash the dev server.
+        } finally {
+          exporting = false;
+        }
+        server.ws.send({ type: "full-reload" });
+      }, 300);
+
+      return []; // Suppress Vite's premature HMR until our export finishes.
+    },
   };
 }
 
@@ -205,14 +234,12 @@ async function handleLocalMediaFileRequest(req: IncomingMessage, res: ServerResp
       writeJson(res, 404, { ok: false, message: "Media file not found." });
       return;
     }
-    const targetPath = path.join(openpressConfig.paths.mediaDir, fileName);
-    const resolvedTarget = path.resolve(targetPath);
-    const mediaRoot = path.resolve(openpressConfig.paths.mediaDir);
-    if (!resolvedTarget.startsWith(`${mediaRoot}${path.sep}`) && resolvedTarget !== mediaRoot) {
-      writeJson(res, 403, { ok: false, message: "Forbidden." });
+    const mediaPath = await findLocalMediaFile(fileName);
+    if (!mediaPath) {
+      writeJson(res, 404, { ok: false, message: "Media file not found." });
       return;
     }
-    const body = await fs.readFile(resolvedTarget);
+    const body = await fs.readFile(mediaPath);
     res.writeHead(200, {
       "Content-Type": mediaMimeType(fileName),
       "Cache-Control": "no-store",
@@ -361,6 +388,11 @@ async function handleLocalDeployRequest(req: IncomingMessage, res: ServerRespons
     return;
   }
 
+  const body = await readJsonRequestBody(req);
+  const slug = normalizePressSlug(body?.press);
+  const cliArgs = slug ? ["deploy", ".", "--confirm", "--press", slug] : ["deploy", ".", "--confirm"];
+  const pdfFilename = pressFilename(openpressConfig.pdf.filename, slug);
+
   if (!isLocalDeployConfigured()) {
     writeJson(res, 400, {
       ok: false,
@@ -370,15 +402,15 @@ async function handleLocalDeployRequest(req: IncomingMessage, res: ServerRespons
       deploy_adapter: openpressConfig.deploy.adapter,
       deploy_source: openpressConfig.deploy.source,
       deploy_project_name: openpressConfig.deploy.projectName,
-      command: openpressCliCommand(["deploy", ".", "--confirm"]),
+      command: openpressCliCommand(cliArgs),
     });
     return;
   }
 
-  const result = await runLocalDeploy();
+  const result = await runLocalDeploy(slug);
   const deployedUrl = extractDeployUrl(result.stdout);
   if (result.code === 0 && deployedUrl) {
-    await writeLocalDeploymentPublicUrl(deployedUrl);
+    await writeLocalDeploymentPublicUrl(deployedUrl, pdfFilename);
   }
   const deploymentInfo = await readLocalDeploymentInfo();
   const publicUrl = deployedUrl ?? deploymentInfo.public_url;
@@ -386,10 +418,10 @@ async function handleLocalDeployRequest(req: IncomingMessage, res: ServerRespons
     ok: result.code === 0,
     code: result.code,
     deployed_at: deploymentInfo.deployed_at,
-    pdf: deployedUrl ? `${deployedUrl}/${openpressConfig.pdf.filename}` : deploymentInfo.pdf,
+    pdf: deployedUrl ? `${deployedUrl}/${pdfFilename}` : deploymentInfo.pdf,
     public_url: publicUrl,
     dirty: false,
-    command: openpressCliCommand(["deploy", ".", "--confirm"]),
+    command: openpressCliCommand(cliArgs),
     stdout: result.stdout,
     stderr: result.stderr,
   });
@@ -420,9 +452,11 @@ function runLocalPdfExport(slug = "") {
   });
 }
 
-function runLocalDeploy() {
+function runLocalDeploy(slug = "") {
+  const args = [openpressCliPath, "deploy", ".", "--confirm"];
+  if (slug) args.push("--press", slug);
   return new Promise<{ code: number; stdout: string; stderr: string }>((resolve) => {
-    const child = spawn("node", [openpressCliPath, "deploy", ".", "--confirm"], {
+    const child = spawn("node", args, {
       cwd: workspaceRoot,
       shell: false,
     });
@@ -485,7 +519,7 @@ async function readLocalDeploymentInfo() {
   }
 }
 
-async function writeLocalDeploymentPublicUrl(publicUrl: string) {
+async function writeLocalDeploymentPublicUrl(publicUrl: string, pdfFilename = openpressConfig.pdf.filename) {
   let deployConfig: Record<string, unknown> = {};
   try {
     deployConfig = JSON.parse(await fs.readFile(openpressConfig.paths.deployMetadata, "utf8")) as Record<string, unknown>;
@@ -495,7 +529,7 @@ async function writeLocalDeploymentPublicUrl(publicUrl: string) {
   await fs.mkdir(path.dirname(openpressConfig.paths.deployMetadata), { recursive: true });
   await fs.writeFile(
     openpressConfig.paths.deployMetadata,
-    `${JSON.stringify({ ...deployConfig, pdf: `${publicUrl}/${openpressConfig.pdf.filename}`, public_url: publicUrl }, null, 2)}\n`,
+    `${JSON.stringify({ ...deployConfig, pdf: `${publicUrl}/${pdfFilename}`, public_url: publicUrl }, null, 2)}\n`,
     "utf8",
   );
 }
@@ -510,16 +544,11 @@ async function isLocalDeploymentDirty(deployedAt: string | undefined) {
 
 function getLocalDeploymentSourcePaths() {
   return [
-    openpressConfig.paths.sourceDir,
-    openpressConfig.paths.mediaDir,
-    openpressConfig.paths.themeDir,
-    openpressConfig.paths.designDoc,
-    openpressConfig.paths.componentsDir,
+    openpressConfig.paths.documentRoot,
     path.join(frameworkRoot, "src"),
     path.join(frameworkRoot, "index.html"),
     path.join(frameworkRoot, "vite.config.ts"),
     path.join(workspaceRoot, "package.json"),
-    path.join(workspaceRoot, "openpress.config.mjs"),
     openpressConfig.configPath,
   ];
 }
@@ -596,6 +625,50 @@ async function uniqueMediaFileName(mediaDir: string, fileName: string) {
   return candidate;
 }
 
+async function findLocalMediaFile(fileName: string): Promise<string | null> {
+  for (const mediaRoot of await collectLocalMediaRoots()) {
+    const resolvedRoot = path.resolve(mediaRoot);
+    const candidate = path.resolve(mediaRoot, fileName);
+    if (!isInsideRoot(candidate, resolvedRoot)) continue;
+    if (await fileExists(candidate)) return candidate;
+  }
+  return null;
+}
+
+async function collectLocalMediaRoots(): Promise<string[]> {
+  const roots = [
+    openpressConfig.paths.mediaDir,
+    path.join(openpressConfig.paths.publicDir, "media"),
+  ];
+  try {
+    const entries = await fs.readdir(openpressConfig.paths.documentRoot, { withFileTypes: true });
+    for (const entry of entries) {
+      if (!entry.isDirectory() || entry.name.startsWith(".") || entry.name === "shared") continue;
+      roots.push(path.join(openpressConfig.paths.documentRoot, entry.name, "media"));
+    }
+  } catch {
+    // Missing press/ is handled by the render/validate commands.
+  }
+  return uniquePaths(roots);
+}
+
+function uniquePaths(paths: string[]): string[] {
+  const out: string[] = [];
+  const seen = new Set<string>();
+  for (const candidate of paths) {
+    const normalized = path.resolve(candidate);
+    if (seen.has(normalized)) continue;
+    seen.add(normalized);
+    out.push(normalized);
+  }
+  return out;
+}
+
+function isInsideRoot(candidate: string, rootDir: string): boolean {
+  const relative = path.relative(rootDir, candidate);
+  return relative === "" || (!relative.startsWith("..") && !path.isAbsolute(relative));
+}
+
 function readRequestBuffer(req: IncomingMessage, maxBytes: number) {
   return new Promise<Buffer>((resolve, reject) => {
     const chunks: Buffer[] = [];

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

@@ -1,96 +0,0 @@
-import { useCallback, useState } from "react";
-import { Camera } from "lucide-react";
-import { toPng } from "html-to-image";
-
-type ExportStatus = "idle" | "exporting" | "done" | "error";
-
-// Exports the currently visible page as a PNG. Locates the page DOM via
-// the data-openpress-page-index attribute (set in PublicReaderPage) and
-// hands it to html-to-image, then triggers a browser download.
-//
-// Lives in the workbench toolbar so it's reachable for any Press shape
-// (manuscript / canvas / slide); for multi-page Press the user navigates
-// to the page first, then exports.
-export function ExportImageControl({
-  currentPageIndex,
-  currentPageLabel,
-  pressTitle,
-}: {
-  currentPageIndex: number;
-  currentPageLabel: string;
-  pressTitle: string;
-}) {
-  const [status, setStatus] = useState<ExportStatus>("idle");
-
-  const handleExport = useCallback(async () => {
-    if (status === "exporting") return;
-    setStatus("exporting");
-
-    try {
-      const pageEl = typeof window === "undefined"
-        ? null
-        : window.document.querySelector<HTMLElement>(
-            `[data-openpress-page-index="${currentPageIndex}"]`,
-          );
-      if (!pageEl) throw new Error("找不到目前頁面");
-
-      // pixelRatio: 2 — retina-ish; keeps text crisp without blowing the file size.
-      // cacheBust: true — force re-fetch of images so stale CORS doesn't taint the canvas.
-      const dataUrl = await toPng(pageEl, {
-        pixelRatio: 2,
-        cacheBust: true,
-        backgroundColor: "#ffffff",
-      });
-
-      const safeTitle = sanitizeFilename(pressTitle) || "openpress";
-      const safePage = sanitizeFilename(currentPageLabel) || String(currentPageIndex + 1);
-      const link = window.document.createElement("a");
-      link.href = dataUrl;
-      link.download = `${safeTitle}-${safePage}.png`;
-      window.document.body.appendChild(link);
-      link.click();
-      link.remove();
-
-      setStatus("done");
-      window.setTimeout(() => setStatus("idle"), 1600);
-    } catch (error) {
-      console.error("[openpress] page PNG export failed", error);
-      setStatus("error");
-      window.setTimeout(() => setStatus("idle"), 2400);
-    }
-  }, [currentPageIndex, currentPageLabel, pressTitle, status]);
-
-  const label = status === "exporting"
-    ? "匯出中…"
-    : status === "done"
-    ? "已下載"
-    : status === "error"
-    ? "匯出失敗"
-    : "PNG";
-  const title = "將目前頁面匯出為 PNG";
-
-  return (
-    <button
-      type="button"
-      className="openpress-workbench-toolbar-action"
-      data-openpress-page-png-export
-      data-openpress-export-status={status}
-      disabled={status === "exporting"}
-      onClick={handleExport}
-      title={title}
-      aria-label={title}
-    >
-      <Camera aria-hidden="true" />
-      <span className="openpress-workbench-toolbar-action__label">{label}</span>
-    </button>
-  );
-}
-
-function sanitizeFilename(value: string): string {
-  return value
-    .replace(/[\\/:*?"<>|]+/g, "-")
-    .replace(/\s+/g, "-")
-    .replace(/-+/g, "-")
-    .replace(/^-+|-+$/g, "")
-    .slice(0, 80);
-}

package/src/styles/openpress/media-workspace.css

@@ -1,230 +0,0 @@
-.openpress-media-assets {
-  display: grid;
-  grid-template-rows: auto minmax(120px, 1fr) auto auto auto;
-  min-height: 0;
-  overflow: hidden;
-}
-
-.openpress-media-workspace-page {
-  position: absolute;
-  inset: 0;
-  z-index: 8;
-  padding: 28px clamp(24px, 4vw, 48px) 40px;
-  background: #141414;
-  color: #dfe1dd;
-  overflow: auto;
-}
-
-.openpress-media-workspace-header {
-  display: flex;
-  gap: 18px;
-  align-items: start;
-  justify-content: space-between;
-  border-bottom: 1px solid rgb(255 255 255 / 9%);
-  padding-bottom: 18px;
-}
-
-.openpress-media-workspace-header .openpress-panel-heading {
-  padding: 0 0 8px;
-}
-
-.openpress-media-workspace-header h2 {
-  margin: 0;
-  color: #f2f2f0;
-  font-size: 22px;
-  font-weight: 500;
-  line-height: 1.2;
-}
-
-.openpress-media-workspace-header p {
-  margin: 8px 0 0;
-  color: #858c93;
-  font-size: 12px;
-}
-
-.openpress-media-workspace-back {
-  flex: 0 0 auto;
-}
-
-.openpress-media-asset-list {
-  display: grid;
-  min-height: 0;
-  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
-  gap: 10px;
-  overflow: auto;
-  padding: 18px 0;
-  scrollbar-width: none;
-}
-
-.openpress-media-asset-list::-webkit-scrollbar {
-  width: 0;
-  height: 0;
-  display: none;
-}
-
-.openpress-media-asset {
-  display: grid;
-  grid-template-columns: 54px minmax(0, 1fr);
-  gap: 12px;
-  align-items: center;
-  min-height: 66px;
-  border: 1px solid rgb(255 255 255 / 9%);
-  padding: 10px;
-  background: rgb(255 255 255 / 3%);
-  color: #a2a8ae;
-  text-decoration: none;
-  transition:
-    border-color 160ms ease,
-    background 160ms ease,
-    color 160ms ease;
-}
-
-.openpress-media-asset:hover {
-  border-color: rgb(255 255 255 / 18%);
-  background: rgb(255 255 255 / 6%);
-  color: #f3f3ef;
-}
-
-.openpress-media-asset__thumb {
-  display: grid;
-  width: 54px;
-  height: 54px;
-  place-items: center;
-  overflow: hidden;
-  border: 1px solid rgb(255 255 255 / 10%);
-  background: #101010;
-}
-
-.openpress-media-asset__thumb img {
-  display: block;
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-}
-
-.openpress-media-asset--svg .openpress-media-asset__thumb img {
-  object-fit: contain;
-  padding: 5px;
-  background: #f4f4f0;
-}
-
-.openpress-media-asset__meta {
-  min-width: 0;
-}
-
-.openpress-media-asset__meta strong {
-  display: block;
-  overflow: hidden;
-  color: #e2e4e1;
-  font-size: 12px;
-  font-weight: 500;
-  line-height: 1.2;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.openpress-media-asset__meta small {
-  display: block;
-  overflow: hidden;
-  margin-top: 4px;
-  color: #6b7178;
-  font-size: 10px;
-  line-height: 1.2;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.openpress-media-dropzone {
-  display: grid;
-  gap: 7px;
-  margin: 0 0 14px;
-  border: 1px dashed rgb(255 255 255 / 18%);
-  padding: 12px;
-  background: rgb(255 255 255 / 2%);
-  color: #7f868d;
-  font-size: 11px;
-  line-height: 1.45;
-  transition:
-    border-color 160ms ease,
-    background 160ms ease,
-    color 160ms ease;
-}
-
-.openpress-media-dropzone[data-drag-active="true"] {
-  border-color: rgb(223 75 33 / 70%);
-  background: rgb(223 75 33 / 9%);
-  color: #ece7df;
-}
-
-.openpress-media-dropzone__action,
-.openpress-staged-asset button {
-  width: fit-content;
-  border: 1px solid rgb(255 255 255 / 14%);
-  padding: 6px 9px;
-  background: rgb(255 255 255 / 4%);
-  color: #ececea;
-  font: inherit;
-  font-size: 11px;
-  cursor: pointer;
-}
-
-.openpress-media-dropzone__action:hover,
-.openpress-staged-asset button:hover {
-  border-color: rgb(255 255 255 / 24%);
-  background: rgb(255 255 255 / 8%);
-}
-
-.openpress-staged-assets {
-  display: grid;
-  max-height: 180px;
-  gap: 8px;
-  overflow: auto;
-  padding: 0 0 12px;
-  scrollbar-width: none;
-}
-
-.openpress-staged-asset {
-  display: grid;
-  grid-template-columns: 34px minmax(0, 1fr) auto;
-  gap: 9px;
-  align-items: center;
-}
-
-.openpress-staged-asset img {
-  width: 34px;
-  height: 34px;
-  object-fit: cover;
-  border: 1px solid rgb(255 255 255 / 10%);
-  background: #111;
-}
-
-.openpress-staged-asset span {
-  min-width: 0;
-}
-
-.openpress-staged-asset strong,
-.openpress-staged-asset small {
-  display: block;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.openpress-staged-asset strong {
-  color: #dedfdd;
-  font-size: 11px;
-  font-weight: 500;
-}
-
-.openpress-staged-asset small {
-  margin-top: 3px;
-  color: #70767d;
-  font-size: 10px;
-}
-
-body::-webkit-scrollbar,
-html::-webkit-scrollbar {
-  width: 0;
-  height: 0;
-  display: none;
-}