@tfw.in/structura-lib 0.2.0

package/dist/index.d.ts

@@ -0,0 +1,38 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+export { Block, BlockOutput, BlockSchema, DocumentOutput } from '@tfw.in/structura-sdk';
+
+interface PdfHighlighterpropss {
+    initialPdfPath?: string | null;
+    initialJsonData?: any | null;
+    props: {
+        APIKey: string;
+        baseUrl?: string;
+        onSave?: (editedData: any) => void | Promise<void>;
+    };
+}
+declare function Structura({ initialPdfPath, initialJsonData, props }: PdfHighlighterpropss): react_jsx_runtime.JSX.Element;
+
+interface PdfHighlighterProps {
+    initialPdfPath?: string | null;
+    prop?: {
+        apiKey: string;
+    };
+}
+interface TableProps {
+    data: any;
+    onCellClick?: (cellId: string) => void;
+    selectedCellId?: string | null;
+}
+interface TableCellProps {
+    cell: any;
+    onClick?: () => void;
+    isSelected?: boolean;
+}
+interface EditableContentProps {
+    content: string;
+    onChange: (newContent: string) => void;
+    isEditing?: boolean;
+}
+
+export { Structura };
+export type { EditableContentProps, PdfHighlighterProps, TableCellProps, TableProps };

package/package.json

@@ -0,0 +1,85 @@
+{
+  "name": "@tfw.in/structura-lib",
+  "version": "0.2.0",
+  "description": "Structura Library Components",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "dist/pdf.worker.mjs",
+    "server",
+    "README.md",
+    "PRODUCTION_ARCHITECTURE.md",
+    "SAVE_FUNCTIONALITY_COMPLETE.md"
+  ],
+  "scripts": {
+    "build": "rollup -c",
+    "dev": "rollup -c -w",
+    "clean": "rimraf dist",
+    "tw:init": "tailwindcss init",
+    "build:css": "postcss styles.css -o dist/styles.css --minify",
+    "server": "node server/server.js",
+    "server:dev": "nodemon server/server.js"
+  },
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "tailwindcss": "^3.3.0"
+  },
+  "dependencies": {
+    "@radix-ui/react-progress": "^1.0.3",
+    "@radix-ui/react-scroll-area": "^1.0.5",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-tabs": "^1.0.4",
+    "@tailwindcss/postcss": "^4.1.8",
+    "@tfw.in/structura-sdk": "^0.1.0",
+    "@types/better-sqlite3": "^7.6.13",
+    "@types/cors": "^2.8.19",
+    "@types/express": "^5.0.5",
+    "better-sqlite3": "^12.4.1",
+    "class-variance-authority": "^0.7.0",
+    "cors": "^2.8.5",
+    "express": "^5.1.0",
+    "lucide-react": "^0.509.0",
+    "pdfjs-dist": "4.8.69",
+    "postcss-cli": "^11.0.1",
+    "react-icons": "^4.12.0",
+    "react-pdf": "^9.2.1",
+    "react-resizable-panels": "^1.0.0",
+    "rollup-plugin-string": "^3.0.0",
+    "tailwind-merge": "^2.2.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.23.9",
+    "@babel/preset-env": "^7.23.9",
+    "@babel/preset-react": "^7.23.9",
+    "@babel/preset-typescript": "^7.23.9",
+    "@rollup/plugin-babel": "^6.0.4",
+    "@rollup/plugin-commonjs": "^25.0.7",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-typescript": "^11.1.6",
+    "@types/node": "^20.17.57",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "autoprefixer": "^10.4.21",
+    "clsx": "^2.1.1",
+    "postcss": "^8.5.4",
+    "postcss-import": "^16.1.0",
+    "rimraf": "^5.0.5",
+    "rollup": "^4.9.1",
+    "rollup-plugin-dts": "^6.1.0",
+    "rollup-plugin-postcss": "^4.0.2",
+    "tailwindcss": "^3.4.17",
+    "tailwindcss-animate": "^1.0.7",
+    "tslib": "^2.6.2",
+    "typescript": "^5.3.3"
+  },
+  "keywords": [
+    "react",
+    "components",
+    "structura"
+  ],
+  "author": "TFW",
+  "license": "MIT"
+}

package/server/README.md

@@ -0,0 +1,203 @@
+# Structura Edit Server
+
+Express server with SQLite storage for saving and retrieving edited documents.
+
+## Quick Start
+
+### 1. Start the server
+
+```bash
+cd /Users/__chaks__/learn/saral-next/old-lib
+npm run server
+```
+
+Server will start on `http://localhost:3002`
+
+### 2. Use the test app
+
+The test app (running on port 5175) automatically connects to the server when you click the **Save** button.
+
+1. Load a PDF with cached JSON:
+   ```
+   http://localhost:5175/?pdf=/aex-hb-gt-101.pdf&json=/gemini-distributed-no-dupes.json
+   ```
+
+2. Double-click any text to edit it
+
+3. Click the **Save** button that appears in the header
+
+4. The edited document will be saved to SQLite database at `old-lib/server/edits.db`
+
+## API Endpoints
+
+### POST /api/save
+
+Save edited JSON for a document.
+
+**Request:**
+```json
+{
+  "pdfName": "aex-hb-gt-101.pdf",
+  "editedJson": { ... },
+  "summary": "Optional edit description"
+}
+```
+
+**Response:**
+```json
+{
+  "success": true,
+  "documentId": 1,
+  "editId": 1,
+  "message": "Document saved successfully"
+}
+```
+
+### GET /api/load/:pdfName
+
+Load the latest edit for a document.
+
+**Example:**
+```bash
+curl http://localhost:3002/api/load/aex-hb-gt-101.pdf
+```
+
+**Response:**
+```json
+{
+  "success": true,
+  "document": {
+    "id": 1,
+    "pdfName": "aex-hb-gt-101.pdf",
+    "originalJson": { ... },
+    "currentJson": { ... },
+    "latestEdit": {
+      "id": 1,
+      "edit_summary": "Manual edit via UI",
+      "created_at": "2025-11-18 10:30:00"
+    }
+  }
+}
+```
+
+### GET /api/history/:pdfName
+
+Get full edit history for a document.
+
+**Example:**
+```bash
+curl http://localhost:3002/api/load/aex-hb-gt-101.pdf
+```
+
+**Response:**
+```json
+{
+  "success": true,
+  "document": {
+    "id": 1,
+    "pdfName": "aex-hb-gt-101.pdf"
+  },
+  "history": [
+    {
+      "id": 2,
+      "document_id": 1,
+      "edited_json": { ... },
+      "edit_summary": "Edit made at 11/18/2025, 10:45:00 AM",
+      "created_at": "2025-11-18 10:45:00"
+    },
+    {
+      "id": 1,
+      "document_id": 1,
+      "edited_json": { ... },
+      "edit_summary": "Manual edit via UI",
+      "created_at": "2025-11-18 10:30:00"
+    }
+  ]
+}
+```
+
+### GET /health
+
+Health check endpoint.
+
+**Example:**
+```bash
+curl http://localhost:3002/health
+```
+
+**Response:**
+```json
+{
+  "status": "ok",
+  "timestamp": "2025-11-18T10:30:00.000Z"
+}
+```
+
+## Database Schema
+
+### documents table
+- `id` - Primary key
+- `pdf_name` - Name of the PDF file
+- `original_json` - Original JSON from first save
+- `created_at` - Timestamp
+
+### edits table
+- `id` - Primary key
+- `document_id` - Foreign key to documents
+- `edited_json` - The edited JSON
+- `edit_summary` - Optional description
+- `created_at` - Timestamp
+
+## Save Behavior
+
+**Q: Is it save-as-you-type or does a Save button show up?**
+
+**A: Save button** - The component shows a green **Save** button in the header when you make edits. Clicking it triggers the `onSave` callback which sends the data to the server. This gives you control over when to persist changes.
+
+## Development
+
+For auto-restart on code changes, install nodemon:
+
+```bash
+npm install --save-dev nodemon
+npm run server:dev
+```
+
+## Testing the Server
+
+### Test save endpoint
+```bash
+curl -X POST http://localhost:3002/api/save \
+  -H "Content-Type: application/json" \
+  -d '{
+    "pdfName": "test.pdf",
+    "editedJson": {"test": "data"},
+    "summary": "Test edit"
+  }'
+```
+
+### Test load endpoint
+```bash
+curl http://localhost:3002/api/load/test.pdf
+```
+
+### Test health check
+```bash
+curl http://localhost:3002/health
+```
+
+## Database Location
+
+The SQLite database is stored at:
+```
+/Users/__chaks__/learn/saral-next/old-lib/server/edits.db
+```
+
+You can inspect it using:
+```bash
+sqlite3 server/edits.db
+.tables
+.schema documents
+.schema edits
+SELECT * FROM documents;
+```

package/server/db.js

@@ -0,0 +1,142 @@
+/**
+ * SQLite database setup for storing edited JSON documents
+ */
+const Database = require('better-sqlite3');
+const path = require('path');
+const fs = require('fs');
+
+// Ensure server directory exists
+const serverDir = path.join(__dirname);
+if (!fs.existsSync(serverDir)) {
+  fs.mkdirSync(serverDir, { recursive: true });
+}
+
+// Create/open database
+const db = new Database(path.join(serverDir, 'edits.db'));
+
+// Initialize tables
+db.exec(`
+  CREATE TABLE IF NOT EXISTS documents (
+    id INTEGER PRIMARY KEY AUTOINCREMENT,
+    pdf_name TEXT NOT NULL,
+    original_json TEXT NOT NULL,
+    created_at DATETIME DEFAULT CURRENT_TIMESTAMP
+  );
+
+  CREATE TABLE IF NOT EXISTS edits (
+    id INTEGER PRIMARY KEY AUTOINCREMENT,
+    document_id INTEGER NOT NULL,
+    edited_json TEXT NOT NULL,
+    edit_summary TEXT,
+    created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
+    FOREIGN KEY (document_id) REFERENCES documents(id)
+  );
+
+  CREATE INDEX IF NOT EXISTS idx_document_pdf ON documents(pdf_name);
+  CREATE INDEX IF NOT EXISTS idx_edits_document ON edits(document_id);
+`);
+
+/**
+ * Save a new document with its original JSON
+ */
+function saveDocument(pdfName, originalJson) {
+  const stmt = db.prepare(`
+    INSERT INTO documents (pdf_name, original_json)
+    VALUES (?, ?)
+  `);
+
+  const result = stmt.run(pdfName, JSON.stringify(originalJson));
+  return result.lastInsertRowid;
+}
+
+/**
+ * Get document by PDF name
+ */
+function getDocumentByPdfName(pdfName) {
+  const stmt = db.prepare(`
+    SELECT * FROM documents
+    WHERE pdf_name = ?
+    ORDER BY created_at DESC
+    LIMIT 1
+  `);
+
+  const doc = stmt.get(pdfName);
+  if (doc) {
+    doc.original_json = JSON.parse(doc.original_json);
+  }
+  return doc;
+}
+
+/**
+ * Save an edit for a document
+ */
+function saveEdit(documentId, editedJson, summary = null) {
+  const stmt = db.prepare(`
+    INSERT INTO edits (document_id, edited_json, edit_summary)
+    VALUES (?, ?, ?)
+  `);
+
+  const result = stmt.run(documentId, JSON.stringify(editedJson), summary);
+  return result.lastInsertRowid;
+}
+
+/**
+ * Get latest edit for a document
+ */
+function getLatestEdit(documentId) {
+  const stmt = db.prepare(`
+    SELECT * FROM edits
+    WHERE document_id = ?
+    ORDER BY created_at DESC
+    LIMIT 1
+  `);
+
+  const edit = stmt.get(documentId);
+  if (edit) {
+    edit.edited_json = JSON.parse(edit.edited_json);
+  }
+  return edit;
+}
+
+/**
+ * Get all edits for a document
+ */
+function getEditHistory(documentId) {
+  const stmt = db.prepare(`
+    SELECT * FROM edits
+    WHERE document_id = ?
+    ORDER BY created_at DESC
+  `);
+
+  const edits = stmt.all(documentId);
+  return edits.map(edit => ({
+    ...edit,
+    edited_json: JSON.parse(edit.edited_json)
+  }));
+}
+
+/**
+ * Get document with latest edit
+ */
+function getDocumentWithLatestEdit(pdfName) {
+  const doc = getDocumentByPdfName(pdfName);
+  if (!doc) return null;
+
+  const latestEdit = getLatestEdit(doc.id);
+
+  return {
+    ...doc,
+    latest_edit: latestEdit,
+    current_json: latestEdit ? latestEdit.edited_json : doc.original_json
+  };
+}
+
+module.exports = {
+  db,
+  saveDocument,
+  getDocumentByPdfName,
+  saveEdit,
+  getLatestEdit,
+  getEditHistory,
+  getDocumentWithLatestEdit
+};

package/server/server.js

@@ -0,0 +1,165 @@
+/**
+ * Express server for handling document edits
+ */
+const express = require('express');
+const cors = require('cors');
+const {
+  saveDocument,
+  getDocumentByPdfName,
+  saveEdit,
+  getDocumentWithLatestEdit,
+  getEditHistory
+} = require('./db');
+
+const app = express();
+const PORT = process.env.PORT || 3002;
+
+// Middleware
+app.use(cors());
+app.use(express.json({ limit: '50mb' })); // Increase limit for large JSON documents
+
+/**
+ * POST /api/save
+ * Save edited JSON for a document
+ *
+ * Request body:
+ * {
+ *   pdfName: string,
+ *   editedJson: object,
+ *   originalJson?: object,  // Optional: if first save, store as original
+ *   summary?: string
+ * }
+ */
+app.post('/api/save', (req, res) => {
+  try {
+    const { pdfName, editedJson, originalJson, summary } = req.body;
+
+    if (!pdfName || !editedJson) {
+      return res.status(400).json({
+        error: 'Missing required fields: pdfName and editedJson'
+      });
+    }
+
+    // Check if document exists
+    let doc = getDocumentByPdfName(pdfName);
+
+    if (!doc) {
+      // Create new document
+      // Use originalJson if provided, otherwise use editedJson as the baseline
+      const baselineJson = originalJson || editedJson;
+      const documentId = saveDocument(pdfName, baselineJson);
+      doc = { id: documentId };
+      console.log(`[Server] Created new document for ${pdfName} with ID ${documentId}`);
+    } else {
+      console.log(`[Server] Found existing document for ${pdfName} with ID ${doc.id}`);
+    }
+
+    // Save the edit
+    const editId = saveEdit(doc.id, editedJson, summary || 'Edit via UI');
+
+    console.log(`[Server] Saved edit ${editId} for document ${doc.id}`);
+
+    res.json({
+      success: true,
+      documentId: doc.id,
+      editId: editId,
+      message: 'Document saved successfully'
+    });
+  } catch (error) {
+    console.error('[Server] Error saving document:', error);
+    res.status(500).json({
+      error: 'Failed to save document',
+      details: error.message
+    });
+  }
+});
+
+/**
+ * GET /api/load/:pdfName
+ * Load the latest edit for a document
+ */
+app.get('/api/load/:pdfName', (req, res) => {
+  try {
+    const { pdfName } = req.params;
+
+    const docWithEdit = getDocumentWithLatestEdit(pdfName);
+
+    if (!docWithEdit) {
+      return res.status(404).json({
+        error: 'Document not found'
+      });
+    }
+
+    res.json({
+      success: true,
+      document: {
+        id: docWithEdit.id,
+        pdfName: docWithEdit.pdf_name,
+        originalJson: docWithEdit.original_json,
+        currentJson: docWithEdit.current_json,
+        latestEdit: docWithEdit.latest_edit
+      }
+    });
+  } catch (error) {
+    console.error('[Server] Error loading document:', error);
+    res.status(500).json({
+      error: 'Failed to load document',
+      details: error.message
+    });
+  }
+});
+
+/**
+ * GET /api/history/:pdfName
+ * Get edit history for a document
+ */
+app.get('/api/history/:pdfName', (req, res) => {
+  try {
+    const { pdfName } = req.params;
+
+    const doc = getDocumentByPdfName(pdfName);
+
+    if (!doc) {
+      return res.status(404).json({
+        error: 'Document not found'
+      });
+    }
+
+    const history = getEditHistory(doc.id);
+
+    res.json({
+      success: true,
+      document: {
+        id: doc.id,
+        pdfName: doc.pdf_name
+      },
+      history: history
+    });
+  } catch (error) {
+    console.error('[Server] Error loading history:', error);
+    res.status(500).json({
+      error: 'Failed to load history',
+      details: error.message
+    });
+  }
+});
+
+/**
+ * GET /health
+ * Health check endpoint
+ */
+app.get('/health', (req, res) => {
+  res.json({ status: 'ok', timestamp: new Date().toISOString() });
+});
+
+// Start server
+app.listen(PORT, () => {
+  console.log(`[Server] Structura edit server running on http://localhost:${PORT}`);
+  console.log(`[Server] Endpoints:`);
+  console.log(`  POST /api/save - Save edited document`);
+  console.log(`  GET  /api/load/:pdfName - Load document with latest edit`);
+  console.log(`  GET  /api/history/:pdfName - Get edit history`);
+  console.log(`  GET  /health - Health check`);
+});
+
+module.exports = app;