@mcp-html-bridge/cli 0.5.1 → 0.6.0

package/package.json

@@ -1,12 +1,15 @@
 {
   "name": "@mcp-html-bridge/cli",
-  "version": "0.5.1",
+  "version": "0.6.0",
   "description": "CLI adapter for MCP-HTML-Bridge",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "bin": {
     "mcp-bridge": "./dist/index.js"
   },
+  "files": [
+    "dist/"
+  ],
   "scripts": {
     "build": "tsc -p tsconfig.json",
     "clean": "rm -rf dist"

package/src/compile.ts

@@ -1,46 +0,0 @@
-// ── compile subcommand: connect to MCP server → extract schemas → generate SKILL.md ──
-import { writeFileSync } from 'node:fs';
-import { MCPClient } from '@mcp-html-bridge/mcp-client';
-import { renderFromSchema } from '@mcp-html-bridge/ui-engine';
-import type { JSONSchema } from '@mcp-html-bridge/ui-engine';
-
-export async function compile(serverCommand: string, outputPath: string): Promise<void> {
-  const client = new MCPClient();
-
-  console.log(`  Connecting to: ${serverCommand}`);
-  await client.connect({ command: serverCommand });
-
-  console.log('  Listing tools...');
-  const tools = await client.listTools();
-  console.log(`  Found ${tools.length} tools`);
-
-  const sections: string[] = [];
-
-  sections.push('# MCP Tool UI Reference\n');
-  sections.push(`> Auto-generated by mcp-html-bridge from \`${serverCommand}\``);
-  sections.push(`> ${tools.length} tools discovered\n`);
-
-  for (const tool of tools) {
-    console.log(`  Processing: ${tool.name}`);
-
-    const schema = tool.inputSchema as JSONSchema;
-    const html = renderFromSchema(schema, {
-      toolName: tool.name,
-      toolDescription: tool.description,
-    });
-
-    sections.push(`## ${tool.name}\n`);
-    if (tool.description) {
-      sections.push(`${tool.description}\n`);
-    }
-    sections.push('```mcp-html');
-    sections.push(html);
-    sections.push('```\n');
-  }
-
-  const content = sections.join('\n');
-  writeFileSync(outputPath, content);
-  console.log(`\n  ✓ Written to ${outputPath}`);
-
-  await client.disconnect();
-}

package/src/index.ts

@@ -1,38 +0,0 @@
-#!/usr/bin/env node
-// ── CLI Entry: mcp-bridge command ──
-import { Command } from 'commander';
-import { testMock } from './test-mock.js';
-import { compile } from './compile.js';
-
-const program = new Command();
-
-program
-  .name('mcp-bridge')
-  .description('MCP-HTML-Bridge — render MCP schemas/data as self-contained HTML')
-  .version('0.1.0');
-
-program
-  .command('compile <server-command>')
-  .description('Connect to an MCP server, extract tool schemas, and generate a SKILL.md file')
-  .option('-o, --output <path>', 'Output file path', 'SKILL.md')
-  .action(async (serverCommand: string, opts: { output: string }) => {
-    try {
-      console.log('\n  mcp-bridge compile\n');
-      await compile(serverCommand, opts.output);
-    } catch (err) {
-      console.error('Error:', (err as Error).message);
-      process.exit(1);
-    }
-  });
-
-program
-  .command('test-mock')
-  .description('Generate HTML from built-in mock datasets for browser testing')
-  .option('-o, --output <dir>', 'Output directory', './mcp-html-output')
-  .option('-d, --debug', 'Enable debug playground panel', false)
-  .action((opts: { output: string; debug: boolean }) => {
-    console.log('\n  mcp-bridge test-mock\n');
-    testMock(opts.output, opts.debug);
-  });
-
-program.parse();

package/src/mock-data.ts

@@ -1,170 +0,0 @@
-// ── Mock datasets for testing ──
-
-/** E-commerce SKU matrix dataset */
-export const ecommerceData = {
-  store: 'TechMart Global',
-  lastUpdated: '2026-03-20T08:00:00Z',
-  summary: {
-    totalSKUs: 8,
-    totalRevenue: 284750.0,
-    avgPrice: 449.99,
-    lowStockCount: 2,
-  },
-  products: [
-    {
-      sku: 'TM-LAP-001',
-      name: 'UltraBook Pro 16"',
-      category: 'Laptops',
-      price: 1299.99,
-      stock: 142,
-      status: 'Active',
-      rating: 4.7,
-      revenue: 92399.29,
-    },
-    {
-      sku: 'TM-LAP-002',
-      name: 'DevStation X1 Carbon',
-      category: 'Laptops',
-      price: 1849.0,
-      stock: 67,
-      status: 'Active',
-      rating: 4.9,
-      revenue: 55470.0,
-    },
-    {
-      sku: 'TM-PHN-001',
-      name: 'Pixel Ultra 8',
-      category: 'Phones',
-      price: 899.0,
-      stock: 234,
-      status: 'Active',
-      rating: 4.5,
-      revenue: 44950.0,
-    },
-    {
-      sku: 'TM-PHN-002',
-      name: 'GalaxyFold Z7',
-      category: 'Phones',
-      price: 1799.0,
-      stock: 12,
-      status: 'Low Stock',
-      rating: 4.3,
-      revenue: 35980.0,
-    },
-    {
-      sku: 'TM-TAB-001',
-      name: 'iPad Air M3',
-      category: 'Tablets',
-      price: 649.0,
-      stock: 0,
-      status: 'Out of Stock',
-      rating: 4.8,
-      revenue: 25960.0,
-    },
-    {
-      sku: 'TM-AUD-001',
-      name: 'AirPods Max 2',
-      category: 'Audio',
-      price: 549.0,
-      stock: 89,
-      status: 'Active',
-      rating: 4.6,
-      revenue: 16470.0,
-    },
-    {
-      sku: 'TM-ACC-001',
-      name: 'MagSafe Charger Bundle',
-      category: 'Accessories',
-      price: 79.99,
-      stock: 456,
-      status: 'Active',
-      rating: 4.2,
-      revenue: 7999.0,
-    },
-    {
-      sku: 'TM-ACC-002',
-      name: 'USB-C Hub 12-in-1',
-      category: 'Accessories',
-      price: 129.99,
-      stock: 8,
-      status: 'Backorder',
-      rating: 4.4,
-      revenue: 5521.71,
-    },
-  ],
-};
-
-/** Particle physics collision dataset */
-export const physicsData = {
-  experiment: 'LHC Run 4 — Higgs Boson Decay Analysis',
-  runId: 'CERN-2026-0342',
-  timestamp: '2026-03-19T14:32:07.291Z',
-  beamEnergy: 13.6, // TeV
-  luminosity: 4.2e34, // cm⁻²s⁻¹
-  description:
-    'Analysis of diphoton invariant mass spectrum from proton-proton collisions at √s = 13.6 TeV. This run focused on measuring the Higgs boson signal strength in the H→γγ decay channel with improved electromagnetic calorimeter calibration. The observed excess at 125.09 GeV is consistent with the Standard Model Higgs boson prediction within 1.2σ.',
-  results: {
-    observedEvents: 14283,
-    backgroundEstimate: 13950,
-    signalExcess: 333,
-    significance: 5.2, // sigma
-    higgsMass: 125.09, // GeV/c²
-    massUncertainty: 0.24,
-    signalStrength: 1.12,
-    signalStrengthError: 0.09,
-  },
-  eventSample: [
-    { eventId: 'EVT-90341', energy: 125.3, eta: -1.42, phi: 2.81, pt: 64.2, channel: 'diphoton', selected: true },
-    { eventId: 'EVT-90342', energy: 124.8, eta: 0.67, phi: -1.23, pt: 58.7, channel: 'diphoton', selected: true },
-    { eventId: 'EVT-90343', energy: 91.2, eta: 2.11, phi: 0.45, pt: 42.1, channel: 'Z-boson', selected: false },
-    { eventId: 'EVT-90344', energy: 125.1, eta: -0.23, phi: -2.67, pt: 71.3, channel: 'diphoton', selected: true },
-    { eventId: 'EVT-90345', energy: 80.4, eta: 1.89, phi: 1.12, pt: 38.5, channel: 'W-boson', selected: false },
-    { eventId: 'EVT-90346', energy: 125.0, eta: 0.02, phi: -0.89, pt: 66.8, channel: 'diphoton', selected: true },
-  ],
-};
-
-/** Sample JSON Schema for a tool */
-export const sampleToolSchema = {
-  name: 'search_products',
-  description: 'Search the product catalog with filters and sorting options.',
-  inputSchema: {
-    type: 'object' as const,
-    properties: {
-      query: {
-        type: 'string',
-        description: 'Search query string',
-      },
-      category: {
-        type: 'string',
-        enum: ['Laptops', 'Phones', 'Tablets', 'Audio', 'Accessories'],
-        description: 'Filter by product category',
-      },
-      priceRange: {
-        type: 'object',
-        properties: {
-          min: { type: 'number', minimum: 0, description: 'Minimum price' },
-          max: { type: 'number', minimum: 0, description: 'Maximum price' },
-        },
-        description: 'Price range filter',
-      },
-      inStockOnly: {
-        type: 'boolean',
-        default: true,
-        description: 'Only show in-stock items',
-      },
-      sortBy: {
-        type: 'string',
-        enum: ['price', 'rating', 'name', 'stock'],
-        description: 'Sort results by field',
-      },
-      limit: {
-        type: 'integer',
-        minimum: 1,
-        maximum: 100,
-        default: 20,
-        description: 'Maximum number of results',
-      },
-    },
-    required: ['query'],
-  },
-};

package/src/test-mock.ts

@@ -1,74 +0,0 @@
-// ── test-mock subcommand: render mock data to HTML files ──
-import { writeFileSync, mkdirSync } from 'node:fs';
-import { join } from 'node:path';
-import { renderFromDataSync, renderFromSchema } from '@mcp-html-bridge/ui-engine';
-import { ecommerceData, physicsData, sampleToolSchema } from './mock-data.js';
-
-export function testMock(outputDir: string, debug: boolean): void {
-  mkdirSync(outputDir, { recursive: true });
-
-  const opts = { debug };
-
-  // 1. E-commerce data (composite: metrics + grid)
-  const ecommerceHtml = renderFromDataSync(ecommerceData, {
-    ...opts,
-    title: 'E-Commerce Dashboard — TechMart',
-    toolName: 'get_inventory',
-  });
-  const ecomPath = join(outputDir, 'ecommerce.html');
-  writeFileSync(ecomPath, ecommerceHtml);
-  console.log(`  ✓ ${ecomPath}`);
-
-  // 2. E-commerce products only (data grid)
-  const gridHtml = renderFromDataSync(ecommerceData.products, {
-    ...opts,
-    title: 'Product Grid',
-    toolName: 'list_products',
-  });
-  const gridPath = join(outputDir, 'data-grid.html');
-  writeFileSync(gridPath, gridHtml);
-  console.log(`  ✓ ${gridPath}`);
-
-  // 3. Physics data (composite: reading block + metrics + grid)
-  const physicsHtml = renderFromDataSync(physicsData, {
-    ...opts,
-    title: 'LHC Collision Analysis',
-    toolName: 'analyze_collisions',
-  });
-  const physicsPath = join(outputDir, 'physics.html');
-  writeFileSync(physicsPath, physicsHtml);
-  console.log(`  ✓ ${physicsPath}`);
-
-  // 4. Physics results only (metrics cards)
-  const metricsHtml = renderFromDataSync(physicsData.results, {
-    ...opts,
-    title: 'Collision Metrics',
-    toolName: 'get_results',
-  });
-  const metricsPath = join(outputDir, 'metrics.html');
-  writeFileSync(metricsPath, metricsHtml);
-  console.log(`  ✓ ${metricsPath}`);
-
-  // 5. Tool schema (form)
-  const formHtml = renderFromSchema(sampleToolSchema.inputSchema, {
-    ...opts,
-    title: 'Search Products',
-    toolName: sampleToolSchema.name,
-    toolDescription: sampleToolSchema.description,
-  });
-  const formPath = join(outputDir, 'form.html');
-  writeFileSync(formPath, formHtml);
-  console.log(`  ✓ ${formPath}`);
-
-  // 6. Deep JSON (json-tree)
-  const treeHtml = renderFromDataSync(physicsData, {
-    ...opts,
-    title: 'Raw JSON Tree',
-  });
-  const treePath = join(outputDir, 'json-tree.html');
-  writeFileSync(treePath, treeHtml);
-  console.log(`  ✓ ${treePath}`);
-
-  console.log(`\n  ${6} HTML files written to ${outputDir}`);
-  console.log('  Open them in a browser to verify rendering.');
-}

package/tsconfig.json

@@ -1,12 +0,0 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "compilerOptions": {
-    "outDir": "./dist",
-    "rootDir": "./src"
-  },
-  "include": ["src/**/*"],
-  "references": [
-    { "path": "../core-ui-engine" },
-    { "path": "../core-mcp-client" }
-  ]
-}