Enable frontend distribution as npm package with backend integration

.github/scripts/sync_version.py

@@ -0,0 +1,81 @@
+#!/usr/bin/env python3
+"""
+Sync frontend package.json version with backend version.
+
+Usage:
+    python sync_version.py <backend_dir> <frontend_dir>
+"""
+
+import sys
+import json
+from pathlib import Path
+
+
+def get_backend_version(backend_dir):
+    """Get version from backend package."""
+    sys.path.insert(0, str(backend_dir))
+    try:
+        import ibex
+        return ibex.__version__
+    except ImportError as e:
+        print(f"Error: Could not import ibex from {backend_dir}: {e}", file=sys.stderr)
+        sys.exit(1)
+
+
+def update_frontend_version(frontend_dir, version):
+    """Update version in frontend package.json."""
+    package_json_path = Path(frontend_dir) / 'package.json'
+
+    if not package_json_path.exists():
+        print(f"Error: package.json not found at {package_json_path}", file=sys.stderr)
+        sys.exit(1)
+
+    # Read package.json
+    with open(package_json_path, 'r', encoding='utf-8') as f:
+        data = json.load(f)
+
+    # Update version
+    old_version = data.get('version', 'unknown')
+    data['version'] = version
+
+    # Write back with proper formatting
+    with open(package_json_path, 'w', encoding='utf-8') as f:
+        json.dump(data, f, indent=2, ensure_ascii=False)
+        f.write('\n')  # Ensure newline at end of file
+
+    print(f"Updated frontend version: {old_version} → {version}")
+    return True
+
+
+def main():
+    if len(sys.argv) != 3:
+        print("Usage: python sync_version.py <backend_dir> <frontend_dir>", file=sys.stderr)
+        sys.exit(1)
+
+    backend_dir = Path(sys.argv[1]).resolve()
+    frontend_dir = Path(sys.argv[2]).resolve()
+
+    if not backend_dir.exists():
+        print(f"Error: Backend directory not found: {backend_dir}", file=sys.stderr)
+        sys.exit(1)
+
+    if not frontend_dir.exists():
+        print(f"Error: Frontend directory not found: {frontend_dir}", file=sys.stderr)
+        sys.exit(1)
+
+    print(f"Backend directory: {backend_dir}")
+    print(f"Frontend directory: {frontend_dir}")
+
+    version = get_backend_version(backend_dir)
+    print(f"Backend version: {version}")
+
+    if update_frontend_version(frontend_dir, version):
+        print("Version sync completed successfully")
+        sys.exit(0)
+    else:
+        print("Version sync failed", file=sys.stderr)
+        sys.exit(1)
+
+
+if __name__ == '__main__':
+    main()

.github/workflows/publish-frontend-npm.yml

@@ -0,0 +1,99 @@
+name: Publish Frontend to NPM
+
+# This workflow publishes the IBEX frontend as an npm package
+# It runs on releases and can also be triggered manually
+
+on:
+  release:
+    types: [published]
+  workflow_dispatch:
+    inputs:
+      version:
+        description: 'Version to publish (leave empty to use package.json version)'
+        required: false
+        type: string
+      tag:
+        description: 'NPM tag (e.g., latest, beta, alpha)'
+        required: false
+        default: 'latest'
+        type: string
+
+jobs:
+  publish-npm:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '18'
+          registry-url: 'https://registry.npmjs.org'
+
+      - name: Setup Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.11'
+
+      - name: Install backend (for version sync)
+        run: |
+          cd backend
+          pip install .
+
+      - name: Install frontend dependencies
+        run: |
+          cd frontend
+          npm ci
+
+      - name: Update version if specified
+        if: github.event.inputs.version != ''
+        run: |
+          cd frontend
+          npm version ${{ github.event.inputs.version }} --no-git-tag-version
+
+      - name: Sync version with backend
+        if: github.event_name == 'release'
+        run: |
+          python3 .github/scripts/sync_version.py backend frontend
+
+      - name: Build package
+        run: |
+          cd frontend
+          npm run package
+
+      - name: Verify package contents
+        run: |
+          cd frontend
+          npm pack --dry-run
+
+      - name: Publish to NPM
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+        run: |
+          cd frontend
+          if [ "${{ github.event.inputs.tag }}" != "" ]; then
+            npm publish --access public --tag ${{ github.event.inputs.tag }}
+          else
+            npm publish --access public
+          fi
+
+      - name: Create summary
+        run: |
+          cd frontend
+          VERSION=$(node -p "require('./package.json').version")
+          echo "## Published to NPM 📦" >> $GITHUB_STEP_SUMMARY
+          echo "" >> $GITHUB_STEP_SUMMARY
+          echo "**Package:** @ibex/frontend" >> $GITHUB_STEP_SUMMARY
+          echo "**Version:** $VERSION" >> $GITHUB_STEP_SUMMARY
+          echo "**Tag:** ${{ github.event.inputs.tag || 'latest' }}" >> $GITHUB_STEP_SUMMARY
+          echo "" >> $GITHUB_STEP_SUMMARY
+          echo "### Installation" >> $GITHUB_STEP_SUMMARY
+          echo '```bash' >> $GITHUB_STEP_SUMMARY
+          echo "npm install -g @ibex/frontend@$VERSION" >> $GITHUB_STEP_SUMMARY
+          echo '```' >> $GITHUB_STEP_SUMMARY