flowengine-mcp-app 2.0.1 → 3.0.1

package/build/ui/instances.js

@@ -1,233 +0,0 @@
-/**
- * Instance / Hosting Management UI
- */
-import { baseLayout, renderEmptyState } from './base.js';
-export function renderInstancesManager(instances) {
-    if (!instances || instances.length === 0) {
-        return baseLayout('Hosting', `
-      <div class="header">
-        <h1>🚀 Hosting Management</h1>
-        <p>Manage your FlowEngine instances</p>
-      </div>
-      ${renderEmptyState('No Instances Found', 'You don\'t have any instances yet. Provision your first instance to get started.')}
-      <div class="card">
-        <h3 style="margin-bottom: 12px;">Get Started</h3>
-        <p style="color: #999; margin-bottom: 16px;">FlowEngine instances are fully-managed n8n automation servers. Each instance includes:</p>
-        <ul style="color: #999; margin-left: 20px; margin-bottom: 16px;">
-          <li>Dedicated n8n automation server</li>
-          <li>Custom domain support</li>
-          <li>Automated backups</li>
-          <li>Scalable storage</li>
-        </ul>
-        <button class="btn btn-primary">+ Provision New Instance</button>
-      </div>
-    `);
-    }
-    const activeInstances = instances.filter((i) => i.status === 'active' || i.status === 'running');
-    const totalStorage = instances.reduce((sum, i) => sum + i.storage_limit_gb, 0);
-    const usedStorage = instances.reduce((sum, i) => sum + (i.storage_used_gb || 0), 0);
-    const instanceCards = instances
-        .map((instance) => {
-        const statusBadge = getInstanceStatusBadge(instance.status);
-        const storagePercent = instance.storage_used_gb ? Math.round((instance.storage_used_gb / instance.storage_limit_gb) * 100) : 0;
-        const storageBarColor = storagePercent > 80 ? '#f87171' : storagePercent > 60 ? '#facc15' : '#4ade80';
-        return `
-        <div class="card">
-          <div class="card-header">
-            <div>
-              <div class="card-title">${instance.instance_url}</div>
-              <div class="card-subtitle">ID: ${instance.id.slice(0, 8)}...</div>
-            </div>
-            ${statusBadge}
-          </div>
-
-          <div>
-            <div class="stat">
-              <span class="stat-label">Storage</span>
-              <span class="stat-value">${instance.storage_used_gb || 0} GB / ${instance.storage_limit_gb} GB</span>
-            </div>
-            <div style="width: 100%; height: 6px; background: #262626; border-radius: 3px; overflow: hidden; margin-top: 8px;">
-              <div style="width: ${storagePercent}%; height: 100%; background: ${storageBarColor}; transition: width 0.3s;"></div>
-            </div>
-
-            <div class="stat" style="margin-top: 12px;">
-              <span class="stat-label">Subscription</span>
-              <span class="stat-value">${instance.subscription_status || 'Active'}</span>
-            </div>
-            ${instance.tier
-            ? `
-            <div class="stat">
-              <span class="stat-label">Tier</span>
-              <span class="stat-value"><span class="badge badge-neutral">${instance.tier}</span></span>
-            </div>`
-            : ''}
-            <div class="stat">
-              <span class="stat-label">Created</span>
-              <span class="stat-value">${new Date(instance.created_at).toLocaleDateString()}</span>
-            </div>
-          </div>
-
-          <div class="actions">
-            <a href="https://${instance.instance_url}" target="_blank" class="btn btn-primary">
-              Open Instance →
-            </a>
-            <button class="btn btn-secondary">Settings</button>
-          </div>
-        </div>
-      `;
-    })
-        .join('');
-    return baseLayout('Hosting', `
-    <div class="header">
-      <h1>🚀 Hosting Management</h1>
-      <p>${instances.length} instances • ${activeInstances.length} active • ${usedStorage.toFixed(1)} / ${totalStorage} GB used</p>
-    </div>
-
-    <div class="grid">
-      ${instanceCards}
-    </div>
-
-    <div class="card">
-      <h3 style="margin-bottom: 12px;">Quick Actions</h3>
-      <div style="display: flex; gap: 12px;">
-        <button class="btn btn-primary">+ New Instance</button>
-        <button class="btn btn-secondary">View All Backups</button>
-        <button class="btn btn-secondary">Billing Settings</button>
-      </div>
-    </div>
-  `);
-}
-export function renderInstanceDetails(instance, healthData) {
-    const statusBadge = getInstanceStatusBadge(instance.status);
-    const storagePercent = instance.storage_used_gb ? Math.round((instance.storage_used_gb / instance.storage_limit_gb) * 100) : 0;
-    return baseLayout(`Instance: ${instance.instance_url}`, `
-    <div class="header">
-      <h1>🚀 ${instance.instance_url}</h1>
-      <p>Instance ID: <span class="code">${instance.id}</span> • ${statusBadge}</p>
-    </div>
-
-    <div class="grid" style="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin-bottom: 24px;">
-      <div class="card">
-        <div class="stat">
-          <span class="stat-label">Status</span>
-          <span class="stat-value">${statusBadge}</span>
-        </div>
-      </div>
-      <div class="card">
-        <div class="stat">
-          <span class="stat-label">Storage</span>
-          <span class="stat-value">${instance.storage_used_gb || 0} / ${instance.storage_limit_gb} GB</span>
-        </div>
-      </div>
-      <div class="card">
-        <div class="stat">
-          <span class="stat-label">Subscription</span>
-          <span class="stat-value">${instance.subscription_status || 'Active'}</span>
-        </div>
-      </div>
-      <div class="card">
-        <div class="stat">
-          <span class="stat-label">Uptime</span>
-          <span class="stat-value">${healthData?.uptime || '99.9%'}</span>
-        </div>
-      </div>
-    </div>
-
-    <div class="card" style="margin-bottom: 24px;">
-      <h3 style="margin-bottom: 16px;">Storage Usage</h3>
-      <div style="margin-bottom: 12px;">
-        <div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
-          <span style="color: #999; font-size: 14px;">Used: ${instance.storage_used_gb || 0} GB</span>
-          <span style="color: #999; font-size: 14px;">${storagePercent}%</span>
-        </div>
-        <div style="width: 100%; height: 12px; background: #262626; border-radius: 6px; overflow: hidden;">
-          <div style="width: ${storagePercent}%; height: 100%; background: linear-gradient(90deg, #4ade80, #22c55e); transition: width 0.3s;"></div>
-        </div>
-      </div>
-      ${storagePercent > 80
-        ? '<div style="color: #f87171; font-size: 13px; margin-top: 12px;">⚠️ Storage is running low. Consider upgrading your plan.</div>'
-        : ''}
-    </div>
-
-    <div class="card" style="margin-bottom: 24px;">
-      <h3 style="margin-bottom: 16px;">Instance Information</h3>
-      <div class="stat">
-        <span class="stat-label">URL</span>
-        <span class="stat-value"><a href="https://${instance.instance_url}" target="_blank">${instance.instance_url}</a></span>
-      </div>
-      ${instance.tier
-        ? `
-      <div class="stat">
-        <span class="stat-label">Tier</span>
-        <span class="stat-value"><span class="badge badge-neutral">${instance.tier}</span></span>
-      </div>`
-        : ''}
-      <div class="stat">
-        <span class="stat-label">Created</span>
-        <span class="stat-value">${new Date(instance.created_at).toLocaleDateString()}</span>
-      </div>
-      <div class="stat">
-        <span class="stat-label">Last Updated</span>
-        <span class="stat-value">${new Date(instance.updated_at).toLocaleDateString()}</span>
-      </div>
-    </div>
-
-    ${healthData ? renderHealthMetrics(healthData) : ''}
-
-    <div class="actions">
-      <a href="https://${instance.instance_url}" target="_blank" class="btn btn-primary">
-        Open Instance →
-      </a>
-      <button class="btn btn-secondary">Change Domain</button>
-      <button class="btn btn-secondary">Upgrade Storage</button>
-      <button class="btn btn-secondary">Create Backup</button>
-      <button class="btn btn-danger">Delete Instance</button>
-    </div>
-  `);
-}
-function getInstanceStatusBadge(status) {
-    // Default to active since we removed status field from API
-    if (!status) {
-        return '<span class="badge badge-success"><span class="dot dot-success"></span>Active</span>';
-    }
-    const statusLower = status.toLowerCase();
-    if (statusLower === 'active' || statusLower === 'running') {
-        return '<span class="badge badge-success"><span class="dot dot-success"></span>Active</span>';
-    }
-    else if (statusLower === 'paused' || statusLower === 'suspended') {
-        return '<span class="badge badge-warning"><span class="dot dot-warning"></span>Paused</span>';
-    }
-    else if (statusLower === 'error' || statusLower === 'failed') {
-        return '<span class="badge badge-error"><span class="dot dot-error"></span>Error</span>';
-    }
-    else if (statusLower === 'provisioning' || statusLower === 'starting') {
-        return '<span class="badge badge-warning"><span class="dot dot-warning"></span>Starting</span>';
-    }
-    else {
-        return '<span class="badge badge-neutral"><span class="dot dot-neutral"></span>Inactive</span>';
-    }
-}
-function renderHealthMetrics(healthData) {
-    return `
-    <div class="card" style="margin-bottom: 24px;">
-      <h3 style="margin-bottom: 16px;">Health Metrics</h3>
-      <div class="stat">
-        <span class="stat-label">Response Time</span>
-        <span class="stat-value">${healthData.response_time || '120ms'}</span>
-      </div>
-      <div class="stat">
-        <span class="stat-label">CPU Usage</span>
-        <span class="stat-value">${healthData.cpu_usage || '23%'}</span>
-      </div>
-      <div class="stat">
-        <span class="stat-label">Memory Usage</span>
-        <span class="stat-value">${healthData.memory_usage || '512 MB'}</span>
-      </div>
-      <div class="stat">
-        <span class="stat-label">Last Health Check</span>
-        <span class="stat-value">${healthData.last_check ? new Date(healthData.last_check).toLocaleString() : 'Just now'}</span>
-      </div>
-    </div>
-  `;
-}
-//# sourceMappingURL=instances.js.map

package/build/ui/instances.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"instances.js","sourceRoot":"","sources":["../../src/ui/instances.ts"],"names":[],"mappings":"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"}

package/build/ui/n8n-viewer.d.ts

@@ -1,12 +0,0 @@
-/**
- * n8n Workflow Viewer - Direct workflow display via MCP
- * No chat interface - just displays workflows returned by MCP
- */
-export interface WorkflowData {
-    name: string;
-    nodes: any[];
-    connections: any;
-    [key: string]: any;
-}
-export declare function renderN8nViewer(workflow?: WorkflowData): string;
-//# sourceMappingURL=n8n-viewer.d.ts.map

package/build/ui/n8n-viewer.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"n8n-viewer.d.ts","sourceRoot":"","sources":["../../src/ui/n8n-viewer.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,GAAG,EAAE,CAAC;IACb,WAAW,EAAE,GAAG,CAAC;IACjB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED,wBAAgB,eAAe,CAAC,QAAQ,CAAC,EAAE,YAAY,GAAG,MAAM,CA+W/D"}

package/build/ui/n8n-viewer.js

@@ -1,371 +0,0 @@
-/**
- * n8n Workflow Viewer - Direct workflow display via MCP
- * No chat interface - just displays workflows returned by MCP
- */
-export function renderN8nViewer(workflow) {
-    const workflowJson = workflow ? JSON.stringify(workflow) : JSON.stringify({
-        "name": "Empty Workflow",
-        "nodes": [
-            {
-                "parameters": {},
-                "id": "1",
-                "name": "Start",
-                "type": "n8n-nodes-base.start",
-                "typeVersion": 1,
-                "position": [250, 300]
-            }
-        ],
-        "connections": {}
-    });
-    // Escape JSON for safe embedding in HTML/JavaScript
-    const escapedWorkflowJson = workflowJson
-        .replace(/\\/g, '\\\\')
-        .replace(/`/g, '\\`')
-        .replace(/\$/g, '\\$');
-    return `<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>FlowEngine - n8n Workflow Viewer</title>
-  <style>
-    * {
-      margin: 0;
-      padding: 0;
-      box-sizing: border-box;
-    }
-
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-      background: #000000;
-      color: #ffffff;
-      height: 100vh;
-      overflow: hidden;
-      display: flex;
-      flex-direction: column;
-    }
-
-    /* Header */
-    .viewer-header {
-      padding: 12px 16px;
-      border-bottom: 1px solid rgba(31, 41, 55, 1);
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      gap: 12px;
-      background: #000000;
-      flex-shrink: 0;
-    }
-
-    .logo {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-      font-size: 16px;
-      font-weight: 700;
-      background: linear-gradient(135deg, #3b82f6, #8b5cf6, #10b981);
-      -webkit-background-clip: text;
-      -webkit-text-fill-color: transparent;
-      background-clip: text;
-    }
-
-    .workflow-title {
-      flex: 1;
-      font-size: 14px;
-      font-weight: 500;
-      color: rgba(209, 213, 219, 1);
-      padding: 0 16px;
-    }
-
-    .header-actions {
-      display: flex;
-      gap: 8px;
-      align-items: center;
-    }
-
-    .action-btn {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      gap: 6px;
-      padding: 6px 12px;
-      background: rgba(31, 41, 55, 0.5);
-      border: 1px solid rgba(75, 85, 99, 1);
-      border-radius: 6px;
-      color: rgba(209, 213, 219, 1);
-      font-size: 12px;
-      font-weight: 500;
-      cursor: pointer;
-      transition: all 0.2s;
-    }
-
-    .action-btn:hover {
-      background: rgba(31, 41, 55, 0.8);
-      border-color: rgba(107, 114, 128, 1);
-    }
-
-    .action-btn.primary {
-      background: #ffffff;
-      color: #000000;
-      border-color: #ffffff;
-    }
-
-    .action-btn.primary:hover {
-      background: rgba(229, 231, 235, 1);
-    }
-
-    /* n8n Viewer Container */
-    .viewer-container {
-      flex: 1;
-      position: relative;
-      overflow: hidden;
-      background: #000000;
-    }
-
-    #n8nDemoElement {
-      width: 100%;
-      height: 100%;
-      border: none;
-      background: #000000;
-    }
-
-    /* Loading State */
-    .loading-overlay {
-      position: absolute;
-      inset: 0;
-      background: #000000;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      gap: 16px;
-      z-index: 10;
-    }
-
-    .loading-overlay.hide {
-      display: none;
-    }
-
-    .spinner {
-      width: 40px;
-      height: 40px;
-      border: 3px solid rgba(75, 85, 99, 0.3);
-      border-top-color: #3b82f6;
-      border-radius: 50%;
-      animation: spin 0.8s linear infinite;
-    }
-
-    @keyframes spin {
-      to { transform: rotate(360deg); }
-    }
-
-    .loading-text {
-      font-size: 14px;
-      color: rgba(156, 163, 175, 1);
-    }
-
-    /* Empty State */
-    .empty-state {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      height: 100%;
-      padding: 32px;
-      text-align: center;
-    }
-
-    .empty-state svg {
-      margin-bottom: 16px;
-      opacity: 0.3;
-    }
-
-    .empty-state h3 {
-      font-size: 18px;
-      font-weight: 600;
-      color: #ffffff;
-      margin-bottom: 8px;
-    }
-
-    .empty-state p {
-      font-size: 14px;
-      color: rgba(156, 163, 175, 1);
-      max-width: 400px;
-    }
-
-    ::-webkit-scrollbar {
-      width: 8px;
-      height: 8px;
-    }
-
-    ::-webkit-scrollbar-track {
-      background: transparent;
-    }
-
-    ::-webkit-scrollbar-thumb {
-      background: rgba(75, 85, 99, 0.5);
-      border-radius: 4px;
-    }
-
-    ::-webkit-scrollbar-thumb:hover {
-      background: rgba(75, 85, 99, 0.7);
-    }
-  </style>
-</head>
-<body>
-  <!-- Header -->
-  <div class="viewer-header">
-    <div class="logo">
-      <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-        <path d="M12 2L2 7L12 12L22 7L12 2Z" fill="url(#gradient)" stroke="currentColor" stroke-width="2"/>
-        <path d="M2 17L12 22L22 17" stroke="currentColor" stroke-width="2"/>
-        <path d="M2 12L12 17L22 12" stroke="currentColor" stroke-width="2"/>
-        <defs>
-          <linearGradient id="gradient" x1="2" y1="2" x2="22" y2="22">
-            <stop offset="0%" stop-color="#3b82f6"/>
-            <stop offset="50%" stop-color="#8b5cf6"/>
-            <stop offset="100%" stop-color="#10b981"/>
-          </linearGradient>
-        </defs>
-      </svg>
-      FlowEngine
-    </div>
-    <div class="workflow-title" id="workflowTitle">Workflow Viewer</div>
-    <div class="header-actions">
-      <button class="action-btn" id="shareBtn" title="Share workflow">
-        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <circle cx="18" cy="5" r="3"></circle>
-          <circle cx="6" cy="12" r="3"></circle>
-          <circle cx="18" cy="19" r="3"></circle>
-          <line x1="8.59" y1="13.51" x2="15.42" y2="17.49"></line>
-          <line x1="15.41" y1="6.51" x2="8.59" y2="10.49"></line>
-        </svg>
-        <span>Share</span>
-      </button>
-      <button class="action-btn" id="exportBtn" title="Export workflow">
-        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
-          <polyline points="7 10 12 15 17 10"></polyline>
-          <line x1="12" y1="15" x2="12" y2="3"></line>
-        </svg>
-        <span>Export</span>
-      </button>
-      <button class="action-btn primary" id="openN8nBtn" title="Open in n8n">
-        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path>
-          <polyline points="15 3 21 3 21 9"></polyline>
-          <line x1="10" y1="14" x2="21" y2="3"></line>
-        </svg>
-        <span>Open in n8n</span>
-      </button>
-    </div>
-  </div>
-
-  <!-- n8n Viewer Container -->
-  <div class="viewer-container">
-    <!-- Loading Overlay -->
-    <div class="loading-overlay" id="loadingOverlay">
-      <div class="spinner"></div>
-      <div class="loading-text">Loading workflow viewer...</div>
-    </div>
-
-    <!-- n8n Demo Element -->
-    <n8n-demo id="n8nDemoElement"></n8n-demo>
-  </div>
-
-  <!-- Load n8n Web Components -->
-  <script src="https://n8n-io.github.io/n8n-demo-webcomponent/webcomponents-loader.js"></script>
-  <script type="module" src="https://n8n-io.github.io/n8n-demo-webcomponent/n8n-demo.bundled.js"></script>
-
-  <script>
-    // Workflow data from MCP
-    const workflowData = JSON.parse(\`${escapedWorkflowJson}\`);
-    const demoElement = document.getElementById('n8nDemoElement');
-    const loadingOverlay = document.getElementById('loadingOverlay');
-    const workflowTitle = document.getElementById('workflowTitle');
-    const shareBtn = document.getElementById('shareBtn');
-    const exportBtn = document.getElementById('exportBtn');
-    const openN8nBtn = document.getElementById('openN8nBtn');
-
-    // Initialize n8n demo
-    function initDemo() {
-      if (customElements.get('n8n-demo')) {
-        try {
-          demoElement.setAttribute('workflow', JSON.stringify(workflowData));
-          demoElement.setAttribute('theme', 'dark');
-          demoElement.setAttribute('collapseformobile', 'false');
-
-          // Update title
-          workflowTitle.textContent = workflowData.name || 'Workflow Viewer';
-
-          // Hide loading overlay
-          setTimeout(() => {
-            loadingOverlay.classList.add('hide');
-          }, 500);
-        } catch (error) {
-          console.error('Failed to initialize n8n demo:', error);
-          loadingOverlay.innerHTML = \`
-            <div class="empty-state">
-              <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-                <circle cx="12" cy="12" r="10"></circle>
-                <line x1="12" y1="8" x2="12" y2="12"></line>
-                <line x1="12" y1="16" x2="12.01" y2="16"></line>
-              </svg>
-              <h3>Failed to Load Workflow</h3>
-              <p>Unable to initialize the workflow viewer. Please try again.</p>
-            </div>
-          \`;
-        }
-      } else {
-        setTimeout(initDemo, 100);
-      }
-    }
-
-    // Start initialization
-    setTimeout(initDemo, 500);
-
-    // Share button - Copy workflow JSON to clipboard
-    shareBtn.addEventListener('click', () => {
-      const workflow = JSON.stringify(workflowData, null, 2);
-      navigator.clipboard.writeText(workflow).then(() => {
-        const originalText = shareBtn.innerHTML;
-        shareBtn.innerHTML = '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"></polyline></svg><span>Copied!</span>';
-        setTimeout(() => {
-          shareBtn.innerHTML = originalText;
-        }, 2000);
-      }).catch(err => {
-        console.error('Failed to copy:', err);
-        alert('Failed to copy workflow to clipboard');
-      });
-    });
-
-    // Export button - Download workflow as JSON file
-    exportBtn.addEventListener('click', () => {
-      const workflow = JSON.stringify(workflowData, null, 2);
-      const blob = new Blob([workflow], { type: 'application/json' });
-      const url = URL.createObjectURL(blob);
-      const a = document.createElement('a');
-      a.href = url;
-      a.download = (workflowData.name || 'workflow').replace(/[^a-z0-9]/gi, '-').toLowerCase() + '.json';
-      a.click();
-      URL.revokeObjectURL(url);
-
-      const originalText = exportBtn.innerHTML;
-      exportBtn.innerHTML = '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"></polyline></svg><span>Exported!</span>';
-      setTimeout(() => {
-        exportBtn.innerHTML = originalText;
-      }, 2000);
-    });
-
-    // Open in n8n button
-    openN8nBtn.addEventListener('click', () => {
-      // This would open the workflow in the actual n8n instance
-      // You can customize this based on your n8n instance URL
-      const n8nUrl = 'https://n8n.flowengine.cloud';
-      window.open(n8nUrl, '_blank');
-    });
-  </script>
-</body>
-</html>`;
-}
-//# sourceMappingURL=n8n-viewer.js.map

package/build/ui/n8n-viewer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"n8n-viewer.js","sourceRoot":"","sources":["../../src/ui/n8n-viewer.ts"],"names":[],"mappings":"AAAA;;;GAGG;AASH,MAAM,UAAU,eAAe,CAAC,QAAuB;IACrD,MAAM,YAAY,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC;QACxE,MAAM,EAAE,gBAAgB;QACxB,OAAO,EAAE;YACP;gBACE,YAAY,EAAE,EAAE;gBAChB,IAAI,EAAE,GAAG;gBACT,MAAM,EAAE,OAAO;gBACf,MAAM,EAAE,sBAAsB;gBAC9B,aAAa,EAAE,CAAC;gBAChB,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC;aACvB;SACF;QACD,aAAa,EAAE,EAAE;KAClB,CAAC,CAAC;IAEH,oDAAoD;IACpD,MAAM,mBAAmB,GAAG,YAAY;SACrC,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC;SACtB,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC;SACpB,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAEzB,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAiQ+B,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAuFnD,CAAC;AACT,CAAC"}

package/build/ui/portals.d.ts

@@ -1,14 +0,0 @@
-/**
- * Client Portals UI
- */
-export interface PortalInstance {
-    id: string;
-    instance_url: string;
-    storage_limit_gb: number;
-    status: string;
-    created_at: string;
-    subscription_status?: string;
-}
-export declare function renderPortalsDashboard(instances: PortalInstance[]): string;
-export declare function renderPortalDetails(instanceId: string, workflows: any[], widgets: any[]): string;
-//# sourceMappingURL=portals.d.ts.map

package/build/ui/portals.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"portals.d.ts","sourceRoot":"","sources":["../../src/ui/portals.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,MAAM,CAAC;IACrB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED,wBAAgB,sBAAsB,CAAC,SAAS,EAAE,cAAc,EAAE,GAAG,MAAM,CA6E1E;AAkBD,wBAAgB,mBAAmB,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,MAAM,CAqChG"}