@open-press/cli 0.8.0 → 1.1.0

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

@@ -1,136 +0,0 @@
-import { useCallback, useMemo, useState } from "react";
-import { isLocalWorkspaceHost } from "../../shared";
-import type { DeploymentInfo } from "../../document-model";
-import type { DeployStatus, PdfActionStatus } from "../workbenchTypes";
-import { parseDeployError, workbenchPdfButtonText, workbenchPdfStatusMessage } from "./deploymentStatusModel";
-
-export interface UseDeploymentWorkbenchOptions {
-  deploymentInfo: DeploymentInfo;
-}
-
-export interface DeploymentWorkbench {
-  status: DeployStatus;
-  pdfActionStatus: PdfActionStatus;
-  currentDeploymentInfo: DeploymentInfo;
-  staticPdfHref: string | undefined;
-  localDeployEnabled: boolean;
-  pdfButtonText: string;
-  pdfButtonDisabled: boolean;
-  pdfStatusMessage: string | null;
-  pdfToolbarExpanded: boolean;
-  handleDeploy: () => Promise<void>;
-  handleOpenWorkbenchPdf: () => void;
-}
-
-export function useDeploymentWorkbench({ deploymentInfo }: UseDeploymentWorkbenchOptions): DeploymentWorkbench {
-  const [status, setStatus] = useState<DeployStatus>("idle");
-  const [pdfActionStatus, setPdfActionStatus] = useState<PdfActionStatus>("idle");
-  const [currentDeploymentInfo, setCurrentDeploymentInfo] = useState(deploymentInfo);
-  const staticPdfHref = currentDeploymentInfo.pdf;
-
-  const localDeployEnabled = useMemo(() => {
-    if (typeof window === "undefined") return false;
-    return isLocalWorkspaceHost(window.location.hostname);
-  }, []);
-
-  const pdfButtonText = workbenchPdfButtonText(localDeployEnabled, pdfActionStatus, staticPdfHref);
-  const pdfStatusMessage = workbenchPdfStatusMessage(localDeployEnabled, pdfActionStatus);
-  const pdfButtonDisabled = localDeployEnabled
-    ? pdfActionStatus === "generating" || pdfActionStatus === "opening"
-    : !staticPdfHref;
-  const pdfToolbarExpanded = pdfActionStatus !== "idle";
-
-  const handleDeploy = useCallback(async () => {
-    if (status === "deploying") return;
-    if (currentDeploymentInfo.configured === false) {
-      setStatus("setup");
-      return;
-    }
-    setStatus("deploying");
-    try {
-      const response = await fetch("/__openpress/deploy", { method: "POST" });
-      if (response.status === 404 || response.status === 405) {
-        setStatus("unavailable");
-        return;
-      }
-      if (!response.ok) {
-        const text = await response.text().catch(() => "");
-        const result = parseDeployError(text);
-        if (result?.deploy_configured === false) {
-          setCurrentDeploymentInfo((info) => ({
-            ...info,
-            configured: false,
-            adapter: result.deploy_adapter ?? info.adapter,
-            source: result.deploy_source ?? info.source,
-            projectName: result.deploy_project_name ?? info.projectName,
-            setupMessage: result.message ?? info.setupMessage,
-          }));
-          setStatus("setup");
-          return;
-        }
-        console.error("OpenPress deploy failed", text);
-        setStatus("failed");
-        return;
-      }
-      const result = (await response.json().catch(() => null)) as {
-        deployed_at?: string;
-        pdf?: string;
-        public_url?: string;
-      } | null;
-      setCurrentDeploymentInfo((info) => ({
-        online: true,
-        deployedAt: result?.deployed_at ?? new Date().toISOString(),
-        pdf: result?.pdf ?? info.pdf ?? __OPENPRESS_PDF_HREF__,
-        publicUrl: result?.public_url ?? info.publicUrl,
-        dirty: false,
-      }));
-      setStatus("deployed");
-      setTimeout(() => setStatus("idle"), 3200);
-    } catch (error) {
-      console.error("OpenPress deploy unavailable", error);
-      setStatus("unavailable");
-    }
-  }, [status, currentDeploymentInfo.configured]);
-
-  const handleOpenLatestLocalPdf = useCallback(async () => {
-    if (pdfActionStatus === "generating") return;
-    setPdfActionStatus("generating");
-    try {
-      const response = await fetch("/__openpress/local-pdf-export", { method: "POST" });
-      if (!response.ok) {
-        const text = await response.text().catch(() => "");
-        throw new Error(text || `Local PDF export failed with status ${response.status}`);
-      }
-      const result = (await response.json().catch(() => null)) as { pdf?: string } | null;
-      const pdfHref = result?.pdf ?? "/__openpress/local-pdf-file";
-      setPdfActionStatus("opening");
-      window.setTimeout(() => window.location.assign(pdfHref), 180);
-    } catch (error) {
-      console.error("OpenPress local PDF export failed", error);
-      setPdfActionStatus("failed");
-    }
-  }, [pdfActionStatus]);
-
-  const handleOpenWorkbenchPdf = useCallback(() => {
-    if (localDeployEnabled) {
-      void handleOpenLatestLocalPdf();
-      return;
-    }
-    if (!staticPdfHref) return;
-    window.open(staticPdfHref, "_blank", "noopener,noreferrer");
-  }, [handleOpenLatestLocalPdf, localDeployEnabled, staticPdfHref]);
-
-  return {
-    status,
-    pdfActionStatus,
-    currentDeploymentInfo,
-    staticPdfHref,
-    localDeployEnabled,
-    pdfButtonText,
-    pdfButtonDisabled,
-    pdfStatusMessage,
-    pdfToolbarExpanded,
-    handleDeploy,
-    handleOpenWorkbenchPdf,
-  };
-}

package/template/core/src/openpress/workbench/dialog/WorkbenchDialog.tsx

@@ -1,72 +0,0 @@
-import { type ReactNode } from "react";
-import { createPortal } from "react-dom";
-import { X } from "lucide-react";
-
-export function WorkbenchDialog({
-  titleId,
-  title,
-  eyebrow,
-  titleMeta,
-  className,
-  backdropClassName,
-  headerClassName,
-  closeLabel,
-  onClose,
-  children,
-  footer,
-}: {
-  titleId: string;
-  title: ReactNode;
-  eyebrow?: ReactNode;
-  titleMeta?: ReactNode;
-  className?: string;
-  backdropClassName?: string;
-  headerClassName?: string;
-  closeLabel: string;
-  onClose: () => void;
-  children: ReactNode;
-  footer?: ReactNode;
-}) {
-  if (typeof document === "undefined") return null;
-
-  return createPortal(
-    <div
-      className={joinClassNames("openpress-workbench-dialog-backdrop", backdropClassName)}
-      role="presentation"
-      onClick={onClose}
-    >
-      <section
-        className={joinClassNames("openpress-workbench-dialog", className)}
-        role="dialog"
-        aria-modal="true"
-        aria-labelledby={titleId}
-        onClick={(event) => event.stopPropagation()}
-      >
-        <header className={joinClassNames("openpress-workbench-dialog__header", headerClassName)}>
-          <div className="openpress-workbench-dialog__heading">
-            {eyebrow ? <span className="openpress-workbench-dialog__eyebrow">{eyebrow}</span> : null}
-            <div className="openpress-workbench-dialog__title-row">
-              <h2 id={titleId}>{title}</h2>
-              {titleMeta ? <div className="openpress-workbench-dialog__title-meta">{titleMeta}</div> : null}
-            </div>
-          </div>
-          <button
-            type="button"
-            className="openpress-workbench-dialog__close"
-            aria-label={closeLabel}
-            onClick={onClose}
-          >
-            <X aria-hidden="true" />
-          </button>
-        </header>
-        {children}
-        {footer ? <footer className="openpress-workbench-dialog__footer">{footer}</footer> : null}
-      </section>
-    </div>,
-    document.body,
-  );
-}
-
-function joinClassNames(...classNames: Array<string | false | null | undefined>) {
-  return classNames.filter(Boolean).join(" ");
-}

package/template/core/src/openpress/workbench/dialog/index.ts

@@ -1 +0,0 @@
-export { WorkbenchDialog } from "./WorkbenchDialog";

package/template/core/src/openpress/workbench/document/components/DocumentPanel.tsx

@@ -1,127 +0,0 @@
-import { createContext, useContext, useId, useState, type ReactNode } from "react";
-import { FolderKanban, MessageSquareText, type LucideIcon } from "lucide-react";
-
-type DocumentPanelProps = {
-  children: ReactNode;
-};
-
-type DocumentPanelTabValue = "comments" | "project";
-
-type DocumentPanelContextValue = {
-  activeTab: DocumentPanelTabValue;
-  setActiveTab: (tab: DocumentPanelTabValue) => void;
-  baseId: string;
-};
-
-const DocumentPanelContext = createContext<DocumentPanelContextValue | null>(null);
-
-const PANEL_TABS: Array<{ value: DocumentPanelTabValue; label: string; icon: LucideIcon }> = [
-  { value: "comments", label: "註解", icon: MessageSquareText },
-  { value: "project", label: "Project", icon: FolderKanban },
-];
-
-function useDocumentPanel() {
-  const value = useContext(DocumentPanelContext);
-  if (!value) throw new Error("DocumentPanel compound components must be rendered inside <DocumentPanel>.");
-  return value;
-}
-
-function DocumentPanelRoot({ children }: DocumentPanelProps) {
-  const reactId = useId();
-  const [activeTab, setActiveTab] = useState<DocumentPanelTabValue>("comments");
-  const baseId = `openpress-document-panel-${reactId.replaceAll(":", "")}`;
-
-  return (
-    <DocumentPanelContext.Provider value={{ activeTab, setActiveTab, baseId }}>
-      <section
-        className="openpress-document-panel"
-        data-openpress-document-panel
-        data-openpress-document-panel-tab={activeTab}
-      >
-        {children}
-      </section>
-    </DocumentPanelContext.Provider>
-  );
-}
-
-function DocumentPanelTabs() {
-  const { activeTab, setActiveTab, baseId } = useDocumentPanel();
-
-  return (
-    <div className="openpress-dev-control-tabs openpress-document-panel-tabs" role="tablist" aria-label="側邊面板">
-      {PANEL_TABS.map((item) => {
-        const Icon = item.icon;
-        const selected = activeTab === item.value;
-        return (
-          <button
-            type="button"
-            role="tab"
-            aria-selected={selected}
-            aria-controls={`${baseId}-${item.value}`}
-            id={`${baseId}-${item.value}-tab`}
-            className={selected ? "is-active" : undefined}
-            key={item.value}
-            onClick={() => setActiveTab(item.value)}
-          >
-            <Icon aria-hidden="true" />
-            <span>{item.label}</span>
-          </button>
-        );
-      })}
-    </div>
-  );
-}
-
-function DocumentPanelTabPanel({
-  value,
-  className,
-  children,
-}: DocumentPanelProps & {
-  value: DocumentPanelTabValue;
-  className?: string;
-}) {
-  const { activeTab, baseId } = useDocumentPanel();
-  const active = activeTab === value;
-
-  return (
-    <section
-      id={`${baseId}-${value}`}
-      className={className}
-      role="tabpanel"
-      aria-labelledby={`${baseId}-${value}-tab`}
-      data-openpress-document-panel-tab-panel={value}
-      data-active={active ? "true" : "false"}
-      hidden={!active}
-    >
-      {children}
-    </section>
-  );
-}
-
-function DocumentPanelProject({ children }: DocumentPanelProps) {
-  return (
-    <DocumentPanelTabPanel value="project" className="openpress-document-panel__project">
-      {children}
-    </DocumentPanelTabPanel>
-  );
-}
-
-function DocumentPanelPendingComments({ children }: DocumentPanelProps) {
-  return (
-    <DocumentPanelTabPanel value="comments" className="openpress-document-panel__comments">
-      {children}
-    </DocumentPanelTabPanel>
-  );
-}
-
-function DocumentPanelSlot({ children }: DocumentPanelProps) {
-  return <>{children}</>;
-}
-
-export const DocumentPanel = Object.assign(DocumentPanelRoot, {
-  Tabs: DocumentPanelTabs,
-  Project: DocumentPanelProject,
-  PendingComments: DocumentPanelPendingComments,
-  Actions: DocumentPanelSlot,
-  CurrentPage: DocumentPanelSlot,
-});

package/template/core/src/openpress/workbench/document/components/InlineSourceEditorLayer.tsx

@@ -1,207 +0,0 @@
-import { useEffect, useMemo, useState } from "react";
-import type {
-  InlineDocumentEditStatus,
-  InlineDocumentSourceTarget,
-} from "../hooks/useInlineDocumentEditor";
-
-export function InlineSourceEditorLayer({
-  target,
-  fetchImpl,
-  onClose,
-  onStatusChange,
-  geometryVersion,
-}: {
-  target: InlineDocumentSourceTarget | null;
-  fetchImpl?: typeof fetch;
-  onClose: () => void;
-  onStatusChange?: (status: InlineDocumentEditStatus) => void;
-  geometryVersion?: unknown;
-}) {
-  const [text, setText] = useState("");
-  const [status, setStatus] = useState<"idle" | "loading" | "saving" | "failed">("idle");
-  const [error, setError] = useState("");
-  const sourceRequestUrl = useMemo(() => target ? sourceReadUrl(target) : "", [target]);
-  const targetRect = useMemo(() => target ? resolveSourceEditorTargetRect(target) : null, [geometryVersion, target]);
-
-  useEffect(() => {
-    if (!target) {
-      setText("");
-      setStatus("idle");
-      setError("");
-      return undefined;
-    }
-
-    const request = fetchImpl ?? globalThis.fetch?.bind(globalThis);
-    if (!request) {
-      setStatus("failed");
-      setError("Source edit endpoint is unavailable.");
-      return undefined;
-    }
-
-    let canceled = false;
-    setStatus("loading");
-    setError("");
-    void request(sourceRequestUrl, { method: "GET" })
-      .then(async (response) => {
-        if (!response.ok) {
-          const message = await response.text().catch(() => "");
-          throw new Error(message || `Source read failed with status ${response.status}`);
-        }
-        return response.json() as Promise<{ source?: { text?: string } }>;
-      })
-      .then((result) => {
-        if (canceled) return;
-        setText(result.source?.text ?? "");
-        setStatus("idle");
-        onStatusChange?.({ state: "editing", blockId: target.block.id });
-      })
-      .catch((readError) => {
-        if (canceled) return;
-        const message = readError instanceof Error ? readError.message : String(readError);
-        setStatus("failed");
-        setError(message);
-        onStatusChange?.({ state: "failed", blockId: target.block.id, message });
-      });
-
-    return () => {
-      canceled = true;
-    };
-  }, [fetchImpl, onStatusChange, sourceRequestUrl, target]);
-
-  if (!target) return null;
-
-  const block = target.block;
-  const position = sourceEditorPosition(targetRect ?? target.rect);
-  const canSave = status !== "loading" && status !== "saving" && text.trim().length > 0;
-
-  const handleSave = async () => {
-    const request = fetchImpl ?? globalThis.fetch?.bind(globalThis);
-    if (!request) {
-      setStatus("failed");
-      setError("Source edit endpoint is unavailable.");
-      return;
-    }
-
-    setStatus("saving");
-    setError("");
-    onStatusChange?.({ state: "saving", blockId: block.id });
-    try {
-      const response = await request("/__openpress/source-edit", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          blockId: block.id,
-          path: block.path,
-          kind: block.kind,
-          name: block.name,
-          source: block.source,
-          sourceMode: true,
-          text,
-        }),
-      });
-      if (!response.ok) {
-        const message = await response.text().catch(() => "");
-        throw new Error(message || `Source edit failed with status ${response.status}`);
-      }
-      setStatus("idle");
-      onStatusChange?.({ state: "saved", blockId: block.id });
-      onClose();
-    } catch (saveError) {
-      const message = saveError instanceof Error ? saveError.message : String(saveError);
-      setStatus("failed");
-      setError(message);
-      onStatusChange?.({ state: "failed", blockId: block.id, message });
-    }
-  };
-
-  const statusText = sourceEditorStatusText(status, error);
-
-  return (
-    <div className="openpress-inline-source-editor-layer" onMouseDown={(event) => event.stopPropagation()}>
-      <section
-        className="openpress-inline-source-editor"
-        role="dialog"
-        aria-label="Source 編輯"
-        style={position}
-      >
-        <header className="openpress-inline-source-editor__header">
-          <div>
-            <span className="openpress-inline-source-editor__eyebrow">SOURCE</span>
-            <strong>{block.name ?? block.kind ?? "Block"}</strong>
-          </div>
-          <button type="button" onClick={onClose} aria-label="關閉 source 編輯">
-            ×
-          </button>
-        </header>
-        <textarea
-          aria-label="Source 內容"
-          value={text}
-          disabled={status === "loading" || status === "saving"}
-          spellCheck={false}
-          onChange={(event) => {
-            setText(event.target.value);
-            onStatusChange?.({ state: "editing", blockId: block.id });
-          }}
-          onKeyDown={(event) => {
-            if (event.key === "Escape") {
-              event.stopPropagation();
-              onClose();
-            }
-          }}
-        />
-        <footer className="openpress-inline-source-editor__footer">
-          <span data-openpress-source-editor-status={status} role="status" aria-live="polite">
-            {statusText}
-          </span>
-          <div>
-            <button type="button" onClick={onClose}>
-              取消
-            </button>
-            <button type="button" onClick={handleSave} disabled={!canSave}>
-              儲存 source
-            </button>
-          </div>
-        </footer>
-      </section>
-    </div>
-  );
-}
-
-function sourceReadUrl(target: InlineDocumentSourceTarget) {
-  const params = new URLSearchParams();
-  params.set("path", target.block.path);
-  params.set("line", String(target.block.source?.line ?? 1));
-  params.set("column", String(target.block.source?.column ?? 1));
-  params.set("endLine", String(target.block.source?.endLine ?? target.block.source?.line ?? 1));
-  params.set("endColumn", String(target.block.source?.endColumn ?? target.block.source?.column ?? 1));
-  return `/__openpress/source-edit?${params.toString()}`;
-}
-
-function resolveSourceEditorTargetRect(target: InlineDocumentSourceTarget) {
-  const rect = target.element.getBoundingClientRect();
-  if (rect.width > 0 || rect.height > 0 || rect.left !== 0 || rect.top !== 0) return rect;
-  return target.rect;
-}
-
-function sourceEditorPosition(rect: DOMRect) {
-  const width = 420;
-  const margin = 14;
-  const viewportWidth = typeof window === "undefined" ? 1280 : window.innerWidth;
-  const viewportHeight = typeof window === "undefined" ? 900 : window.innerHeight;
-  const left = Math.min(Math.max(rect.left, margin), Math.max(margin, viewportWidth - width - margin));
-  const top = rect.bottom + 12 + 280 < viewportHeight
-    ? rect.bottom + 12
-    : Math.max(margin, rect.top - 292);
-  return {
-    left,
-    top,
-    width,
-  };
-}
-
-function sourceEditorStatusText(status: "idle" | "loading" | "saving" | "failed", error: string) {
-  if (status === "loading") return "讀取中";
-  if (status === "saving") return "儲存中";
-  if (status === "failed") return error || "儲存失敗";
-  return "可編輯 source";
-}

package/template/core/src/openpress/workbench/document/components/ReaderStage.tsx

@@ -1,9 +0,0 @@
-import { forwardRef, type ReactNode } from "react";
-
-export const ReaderStage = forwardRef<HTMLElement, { children: ReactNode }>(function ReaderStage({ children }, ref) {
-  return (
-    <main className="reader-stage" tabIndex={-1} ref={ref}>
-      {children}
-    </main>
-  );
-});

package/template/core/src/openpress/workbench/document/hooks/useDocumentWorkbenchModel.ts

@@ -1,34 +0,0 @@
-import { useMemo } from "react";
-import {
-  collectBookmarkIndex,
-  collectMediaAssetIndex,
-  createAnchorPageMap,
-  getSourceBlockMap,
-  type ReaderDocument,
-} from "../../../document-model";
-import type { DisplayPage } from "../../../reader";
-import { groupSourceBlocksByPath } from "../../inspector";
-import { createProjectComponentUsages, createProjectMentionItems } from "../../project";
-
-export function useDocumentWorkbenchModel(document: ReaderDocument, pages: DisplayPage[]) {
-  const mediaAssets = useMemo(() => collectMediaAssetIndex(pages), [pages]);
-  const anchorPageMap = useMemo(() => createAnchorPageMap(pages), [pages]);
-  const projectComponentUsages = useMemo(() => createProjectComponentUsages(pages), [pages]);
-  const bookmarks = useMemo(() => collectBookmarkIndex(pages), [pages]);
-  const sourceBlockMap = useMemo(() => getSourceBlockMap(document), [document]);
-  const sourceBlocksByPath = useMemo(() => groupSourceBlocksByPath(sourceBlockMap), [sourceBlockMap]);
-  const projectMentionItems = useMemo(
-    () => createProjectMentionItems(mediaAssets, projectComponentUsages, bookmarks),
-    [bookmarks, mediaAssets, projectComponentUsages],
-  );
-
-  return {
-    mediaAssets,
-    anchorPageMap,
-    projectComponentUsages,
-    bookmarks,
-    sourceBlockMap,
-    sourceBlocksByPath,
-    projectMentionItems,
-  };
-}