@open-press/core 1.1.4 → 1.2.1

package/src/openpress/workbench/shell/WorkbenchShell.tsx

@@ -6,6 +6,7 @@ type WorkbenchShellContextValue = {
   rightPanelOpen: boolean;
   onToggleLeftPanel: () => void;
   onToggleRightPanel: () => void;
+  withRightPanel: boolean;
 };
 
 const WorkbenchShellContext = createContext<WorkbenchShellContextValue | null>(null);
@@ -18,7 +19,6 @@ function useWorkbenchShell() {
 
 function WorkbenchShellRoot({
   style,
-  devMode,
   viewMode,
   pressType = "pages",
   presentationMode = false,
@@ -28,10 +28,11 @@ function WorkbenchShellRoot({
   rightPanelOpen,
   onToggleLeftPanel,
   onToggleRightPanel,
+  withRightPanel = true,
+  publicViewer = false,
   children,
 }: {
   style: CSSProperties;
-  devMode: boolean;
   viewMode: string;
   pressType?: string;
   presentationMode?: boolean;
@@ -41,20 +42,42 @@ function WorkbenchShellRoot({
   rightPanelOpen: boolean;
   onToggleLeftPanel: () => void;
   onToggleRightPanel: () => void;
+  // When false the toolbar omits the right-panel toggle button and the
+  // shell grid runs without a right column. Used by the public viewer
+  // where the right panel currently has no content (comments + project
+  // entry are workbench-only).
+  withRightPanel?: boolean;
+  // Marks the outer <main> with `data-openpress-public-viewer` so CSS
+  // and external integrations can target the public reading surface.
+  publicViewer?: boolean;
   children: ReactNode;
 }) {
-  const scrimOpen = leftPanelOpen || rightPanelOpen;
-  const handleScrimClick = rightPanelOpen ? onToggleRightPanel : onToggleLeftPanel;
+  const effectiveRightOpen = withRightPanel ? rightPanelOpen : false;
+  const scrimOpen = leftPanelOpen || effectiveRightOpen;
+  const handleScrimClick = effectiveRightOpen ? onToggleRightPanel : onToggleLeftPanel;
   const shellClassName = [
     "reader-app openpress-reader-app openpress-public-viewer openpress-dev-public-viewer openpress-workbench-shell is-ready",
     leftPanelOpen ? "" : "is-closed-left",
-    rightPanelOpen ? "" : "is-closed-right",
+    effectiveRightOpen ? "" : "is-closed-right",
+    withRightPanel ? "" : "openpress-workbench-shell--no-right-panel",
     presentationMode ? "is-presentation-mode" : "",
   ].filter(Boolean).join(" ");
 
   return (
-    <WorkbenchShellContext.Provider value={{ leftPanelOpen, rightPanelOpen, onToggleLeftPanel, onToggleRightPanel }}>
-      <main className="openpress-workbench" style={style} data-dev-mode={devMode ? "true" : "false"}>
+    <WorkbenchShellContext.Provider
+      value={{
+        leftPanelOpen,
+        rightPanelOpen: effectiveRightOpen,
+        onToggleLeftPanel,
+        onToggleRightPanel,
+        withRightPanel,
+      }}
+    >
+      <main
+        className="openpress-workbench"
+        style={style}
+        data-openpress-public-viewer={publicViewer ? "true" : undefined}
+      >
         <div
           className={shellClassName}
           data-openpress-react-runtime="true"
@@ -82,6 +105,7 @@ export function WorkbenchToolbar({ children }: { children: ReactNode }) {
     rightPanelOpen,
     onToggleLeftPanel,
     onToggleRightPanel,
+    withRightPanel,
   } = useWorkbenchShell();
   const LeftIcon = leftPanelOpen ? PanelLeftClose : PanelLeftOpen;
   const RightIcon = rightPanelOpen ? PanelRightClose : PanelRightOpen;
@@ -109,17 +133,19 @@ export function WorkbenchToolbar({ children }: { children: ReactNode }) {
       <div className="openpress-workbench-toolbar__content">
         {children}
       </div>
-      <button
-        type="button"
-        className="openpress-workbench-toolbar-panel-toggle"
-        data-openpress-toggle-right-panel
-        data-openpress-panel-open={rightPanelOpen ? "true" : "false"}
-        aria-label={rightLabel}
-        title={rightLabel}
-        onClick={onToggleRightPanel}
-      >
-        <RightIcon aria-hidden="true" />
-      </button>
+      {withRightPanel ? (
+        <button
+          type="button"
+          className="openpress-workbench-toolbar-panel-toggle"
+          data-openpress-toggle-right-panel
+          data-openpress-panel-open={rightPanelOpen ? "true" : "false"}
+          aria-label={rightLabel}
+          title={rightLabel}
+          onClick={onToggleRightPanel}
+        >
+          <RightIcon aria-hidden="true" />
+        </button>
+      ) : null}
     </header>
   );
 }

package/src/openpress/workbench/shell/WorkbenchToolbarActions.tsx

@@ -0,0 +1,206 @@
+import { Home, MousePointer2, Play, Ruler } from "lucide-react";
+import type { Dispatch, SetStateAction } from "react";
+import type { DeploymentInfo, HtmlPageBlock, SourceBlock, Theme } from "../../document-model";
+import type { PageLayoutMode, PageViewportScaleMode } from "../../reader";
+import {
+  DeploymentControl,
+  ExportControl,
+  PageZoomControl,
+  SearchControl,
+} from "../actions";
+import type { DeployStatus, InspectorCommentStatus, PdfActionStatus } from "../workbenchTypes";
+import type { PageGeometrySpec } from "../workbenchFormatters";
+import type { InlineDocumentEditStatus } from "../document";
+
+export function WorkbenchToolbarActions({
+  pages,
+  currentPageIndex,
+  pressTitle,
+  theme,
+  workspaceMode,
+  sourceBlocksByPath,
+  onSelectPage,
+  onBackToWorkspace,
+  isSlidePress,
+  onOpenPresentation,
+  pageGeometry,
+  scaleMode,
+  scaleLabel,
+  pageLayoutMode,
+  onScaleModeChange,
+  onPageLayoutModeChange,
+  inlineEditStatus,
+  editStatusMessage,
+  inspectorMode,
+  inspectorToolbarExpanded,
+  inspectorSelectionLabel,
+  onInspectorModeChange,
+  inspectorCommentStatus,
+  inspectorCommentStatusMessage,
+  deploymentInfo,
+  deploymentStatus,
+  localDeployEnabled,
+  onDeploy,
+  onExportPdf,
+  pdfDisabled,
+  pdfLabel,
+  pdfStatusMessage,
+  pdfActionStatus,
+}: {
+  pages: HtmlPageBlock[];
+  currentPageIndex: number;
+  pressTitle: string;
+  theme?: Theme;
+  workspaceMode: boolean;
+  sourceBlocksByPath: Record<string, SourceBlock[]>;
+  onSelectPage: (pageIndex: number, options?: { behavior?: ScrollBehavior }) => void;
+  onBackToWorkspace?: () => void;
+  isSlidePress: boolean;
+  onOpenPresentation?: (pageIndex: number) => void;
+  pageGeometry: PageGeometrySpec;
+  scaleMode: PageViewportScaleMode;
+  scaleLabel: string;
+  pageLayoutMode: PageLayoutMode;
+  onScaleModeChange: Dispatch<SetStateAction<PageViewportScaleMode>>;
+  onPageLayoutModeChange: Dispatch<SetStateAction<PageLayoutMode>>;
+  inlineEditStatus: InlineDocumentEditStatus;
+  editStatusMessage: string;
+  inspectorMode: boolean;
+  inspectorToolbarExpanded: boolean;
+  inspectorSelectionLabel: string;
+  onInspectorModeChange: (enabled: boolean) => void;
+  inspectorCommentStatus: InspectorCommentStatus;
+  inspectorCommentStatusMessage: string;
+  deploymentInfo: DeploymentInfo;
+  deploymentStatus: DeployStatus;
+  localDeployEnabled: boolean;
+  onDeploy: () => Promise<void>;
+  onExportPdf: () => void;
+  pdfDisabled: boolean;
+  pdfLabel: string;
+  pdfStatusMessage: string | null;
+  pdfActionStatus: PdfActionStatus;
+}) {
+  return (
+    <>
+      {onBackToWorkspace ? (
+        <div className="openpress-workbench-toolbar__group" aria-label="工作台導覽">
+          <button
+            type="button"
+            className="openpress-workbench-toolbar-action openpress-workbench-toolbar-action--back"
+            data-openpress-back-to-workspace
+            onClick={onBackToWorkspace}
+            title="回到工作台"
+            aria-label="回到工作台"
+          >
+            <Home aria-hidden="true" />
+            <span className="openpress-workbench-toolbar-action__label">工作台</span>
+          </button>
+        </div>
+      ) : null}
+      <div className="openpress-workbench-toolbar__group" aria-label="匯出">
+        <ExportControl
+          pages={pages}
+          currentPageIndex={currentPageIndex}
+          pressTitle={pressTitle}
+          theme={theme}
+          onExportPdf={onExportPdf}
+          pdfDisabled={pdfDisabled}
+          pdfLabel={pdfLabel}
+          pdfStatusMessage={pdfStatusMessage}
+          pdfActionStatus={pdfActionStatus}
+        />
+      </div>
+      <div className="openpress-workbench-toolbar__group openpress-workbench-toolbar__group--page" aria-label="頁面規格">
+        {isSlidePress && onOpenPresentation ? (
+          <button
+            type="button"
+            className="openpress-workbench-toolbar-action"
+            data-openpress-slide-present
+            data-openpress-toolbar-expanded="false"
+            data-openpress-toolbar-active="false"
+            aria-pressed="false"
+            title="進入放映模式"
+            aria-label="進入放映模式"
+            onClick={() => onOpenPresentation(currentPageIndex)}
+          >
+            <Play aria-hidden="true" />
+            <span className="openpress-workbench-toolbar-action__label">放映</span>
+          </button>
+        ) : null}
+        <button
+          type="button"
+          className="openpress-workbench-page-geometry"
+          data-openpress-page-geometry
+          title={pageGeometry.title}
+          aria-label={`頁面規格 ${pageGeometry.title}`}
+        >
+          <Ruler aria-hidden="true" />
+          <span className="openpress-workbench-page-geometry__label">{pageGeometry.label}</span>
+          <span className="openpress-workbench-page-geometry__dimensions">{pageGeometry.dimensions}</span>
+        </button>
+        <PageZoomControl
+          scaleMode={scaleMode}
+          scaleLabel={scaleLabel}
+          pageLayoutMode={pageLayoutMode}
+          onScaleModeChange={onScaleModeChange}
+          onPageLayoutModeChange={onPageLayoutModeChange}
+        />
+      </div>
+      <div className="openpress-workbench-toolbar__group openpress-workbench-toolbar__group--right" aria-label="工作台狀態與發布">
+        {workspaceMode ? (
+          <SearchControl
+            sourceBlocksByPath={sourceBlocksByPath}
+            onSelectPage={onSelectPage}
+          />
+        ) : null}
+        {workspaceMode && editStatusMessage ? (
+          <span
+            className="openpress-dev-edit-status openpress-dev-edit-status--toolbar"
+            data-openpress-edit-status={inlineEditStatus.state}
+            role="status"
+            aria-live="polite"
+          >
+            {inlineEditStatus.state === "saving" ? <span className="openpress-dev-edit-status__spinner" aria-hidden="true" /> : null}
+            <span>{editStatusMessage}</span>
+          </span>
+        ) : null}
+        {workspaceMode ? (
+          <button
+            type="button"
+            className="openpress-workbench-toolbar-action"
+            data-openpress-inspector-toggle
+            data-openpress-inspector-active={inspectorMode ? "true" : "false"}
+            data-openpress-toolbar-expanded={inspectorToolbarExpanded ? "true" : "false"}
+            data-openpress-toolbar-active={inspectorToolbarExpanded ? "true" : "false"}
+            onClick={() => onInspectorModeChange(!inspectorMode)}
+            aria-pressed={inspectorMode}
+            title={inspectorMode ? "關閉註解" : "開啟註解"}
+            aria-label={inspectorMode ? "關閉註解" : "開啟註解"}
+          >
+            <MousePointer2 aria-hidden="true" />
+            <span className="openpress-workbench-toolbar-action__label">{inspectorMode ? "註解中" : "註解"}</span>
+            <span className="openpress-dev-inspector-status">{inspectorSelectionLabel}</span>
+          </button>
+        ) : null}
+        {workspaceMode && inspectorMode ? (
+          <span
+            className="openpress-dev-inspector-status"
+            role="status"
+            aria-live="polite"
+            data-openpress-inspector-comment-status={inspectorCommentStatus}
+          >
+            {inspectorCommentStatusMessage}
+          </span>
+        ) : null}
+        {localDeployEnabled ? (
+          <DeploymentControl
+            info={deploymentInfo}
+            status={deploymentStatus}
+            onDeploy={onDeploy}
+          />
+        ) : null}
+      </div>
+    </>
+  );
+}

package/src/styles/openpress/app-shell.css

@@ -105,89 +105,6 @@ body {
   font-size: 13px;
 }
 
-/* ── Action Overlay（部署）──────────────────────────────────── */
-.openpress-action-overlay {
-  position: fixed;
-  inset: 0;
-  z-index: 200;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: rgb(10 10 10 / 72%);
-  backdrop-filter: blur(12px);
-  -webkit-backdrop-filter: blur(12px);
-  animation: openpress-overlay-in 0.18s ease both;
-}
-
-@keyframes openpress-overlay-in {
-  from { opacity: 0; }
-  to   { opacity: 1; }
-}
-
-.openpress-action-overlay__card {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 10px;
-  border: 1px solid rgb(255 255 255 / 12%);
-  border-radius: 16px;
-  padding: 36px 48px;
-  background: rgb(22 22 22 / 96%);
-  box-shadow: 0 24px 64px rgb(0 0 0 / 60%);
-  text-align: center;
-  min-width: 220px;
-}
-
-.openpress-action-overlay__title {
-  margin: 0;
-  color: #f2f2f0;
-  font-size: 15px;
-  font-weight: 600;
-  letter-spacing: 0.01em;
-}
-
-.openpress-action-overlay__sub {
-  margin: 0;
-  color: rgb(200 200 200 / 60%);
-  font-size: 12px;
-}
-
-/* ── Deploy Icon ─────────────────────────────────────────────── */
-.openpress-deploy-icon {
-  position: relative;
-  width: 80px;
-  height: 80px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.openpress-deploy-icon--deploying { color: var(--openpress-accent, #e5c97a); }
-.openpress-deploy-icon--deployed  { color: #6ee7a0; }
-.openpress-deploy-icon--failed    { color: #f87171; }
-
-.openpress-deploy-rocket {
-  animation: openpress-rocket-fly 1.4s ease-in-out infinite alternate;
-}
-
-@keyframes openpress-rocket-fly {
-  from { transform: translateY(4px) rotate(-6deg); }
-  to   { transform: translateY(-6px) rotate(6deg); }
-}
-
-.openpress-deploy-orbit {
-  position: absolute;
-  inset: 0;
-  width: 80px;
-  height: 80px;
-  animation: openpress-orbit-spin 2.4s linear infinite;
-}
-
-@keyframes openpress-orbit-spin {
-  from { transform: rotate(0deg); }
-  to   { transform: rotate(360deg); }
-}
-
 /* ── Empty document state ───────────────────────────────────── */
 
 .openpress-empty-state {

package/src/styles/openpress/print-route.css

@@ -27,7 +27,6 @@
   }
 
   .openpress-workbench,
-  .openpress-public-shell,
   .openpress-reader-app,
   .openpress-reader-app.is-closed-left,
   .openpress-reader-app.is-closed-right,
@@ -47,8 +46,7 @@
   .reader-navbar,
   .reader-side-nav,
   .openpress-workspace-panel,
-  .openpress-public-identity,
-  .openpress-html-page__toolbar {
+  .openpress-public-identity {
     display: none !important;
   }