first commit

src/components/Layout.tsx

@@ -0,0 +1,57 @@
+import React from 'react';
+
+export type ToolId = 'split' | 'reorder' | 'merge' | 'annotate';
+
+interface LayoutProps {
+  activeTool: ToolId;
+  onToolChange: (tool: ToolId) => void;
+  children: React.ReactNode;
+}
+
+const Layout: React.FC<LayoutProps> = ({ activeTool, onToolChange, children }) => {
+  return (
+    <div className="app-shell">
+      <aside className="app-sidebar">
+        <div>
+          <h1>PDF Workbench</h1>
+          <small>Self-hosted, browser-based</small>
+        </div>
+
+        <nav className="app-nav">
+          <button
+            className={activeTool === 'split' ? 'active' : ''}
+            onClick={() => onToolChange('split')}
+          >
+            Split / Extract
+          </button>
+          <button
+            className={activeTool === 'reorder' ? 'active' : ''}
+            onClick={() => onToolChange('reorder')}
+          >
+            Reorder / Delete / Rotate
+          </button>
+          <button
+            className={activeTool === 'merge' ? 'active' : ''}
+            onClick={() => onToolChange('merge')}
+            disabled
+            title="Coming soon"
+          >
+            Merge PDFs
+          </button>
+          <button
+            className={activeTool === 'annotate' ? 'active' : ''}
+            onClick={() => onToolChange('annotate')}
+            disabled
+            title="Coming soon"
+          >
+            Annotations
+          </button>
+        </nav>
+      </aside>
+
+      <main className="app-main">{children}</main>
+    </div>
+  );
+};
+
+export default Layout;