nitrostack 1.0.71 → 1.0.73

package/src/studio/package.json

@@ -12,15 +12,17 @@
     "export": "next build && next export"
   },
   "dependencies": {
+    "@elevenlabs/elevenlabs-js": "^2.28.0",
     "@fontsource/inter": "^5.2.8",
     "@fontsource/jetbrains-mono": "^5.2.8",
+    "@heroicons/react": "^2.2.0",
     "@modelcontextprotocol/sdk": "^1.0.4",
     "clsx": "^2.1.0",
     "eventsource": "^2.0.2",
-    "lucide-react": "^0.546.0",
     "next": "^14.2.5",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "reactflow": "^11.11.4",
     "zustand": "^4.5.0"
   },
   "devDependencies": {

package/src/studio/tailwind.config.ts

@@ -9,21 +9,42 @@ const config: Config = {
   ],
   theme: {
     extend: {
+      fontFamily: {
+        heading: ['Space Grotesk', 'sans-serif'],
+        body: ['IBM Plex Sans', 'sans-serif'],
+        mono: ['JetBrains Mono', 'Fira Code', 'Consolas', 'monospace'],
+      },
       colors: {
-        // Brand colors - Gold & Black
-        primary: {
-          DEFAULT: '#d4af37', // Gold
-          50: '#fdfcf8',
-          100: '#f9f7ed',
-          200: '#f2ecd3',
-          300: '#ead9a1',
-          400: '#e2c870',
-          500: '#d4af37', // Main gold
-          600: '#b8962b',
-          700: '#967824',
-          800: '#7a6020',
-          900: '#654f1d',
-        },
+        // MCP Brand Core Colors
+        slateInk: '#121217',
+        coolMint: '#2AB5A5',
+        signalBlue: '#3B82F6',
+
+        // MCP Extended Palette - Light Mode
+        'light-canvas': '#F5F6FA',
+        'light-white': '#FFFFFF',
+        'light-text-primary': '#121217',
+        'light-text-secondary': '#5F6475',
+        'light-border-soft': '#E6E8F0',
+        'light-border-subtle': '#EEF0F6',
+
+        // MCP Extended Palette - Dark Mode
+        'dark-base': '#0E0F14',
+        'dark-surface': '#1B1B20',
+        'dark-text-primary': '#E9E9F0',
+        'dark-text-muted': '#B4B4CC',
+        'dark-border-panel': '#312626',
+
+        // MCP Status Colors (same light/dark)
+        'status-success': '#2AB5A5',
+        'status-warning': '#F59E0B',
+        'status-error': '#EF4444',
+        'status-info': '#0A9CA9',
+
+        // MCP Accent
+        'accent-steel': '#4D777F',
+
+        // CSS Variable mapped colors (for compatibility)
         background: 'hsl(var(--background))',
         foreground: 'hsl(var(--foreground))',
         card: {
@@ -34,6 +55,10 @@ const config: Config = {
           DEFAULT: 'hsl(var(--popover))',
           foreground: 'hsl(var(--popover-foreground))',
         },
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
         secondary: {
           DEFAULT: 'hsl(var(--secondary))',
           foreground: 'hsl(var(--secondary-foreground))',
@@ -55,9 +80,30 @@ const config: Config = {
         ring: 'hsl(var(--ring))',
       },
       borderRadius: {
-        lg: 'var(--radius)',
-        md: 'calc(var(--radius) - 2px)',
-        sm: 'calc(var(--radius) - 4px)',
+        // MCP Border Radius System
+        DEFAULT: '4px', // MCP default
+        'none': '0',
+        'sm': '2px',
+        'md': '4px', // MCP default
+        'lg': '6px',
+        'xl': '8px',
+        '2xl': '12px',
+        '3xl': '16px',
+        'pill': '999px', // MCP pill
+        'full': '9999px', // Circle
+      },
+      boxShadow: {
+        // MCP Shadow System - Light Mode
+        'low-light': '0px 1px 3px rgba(240, 100, 49, 0.08)',
+        'medium-light': '0px 4px 12px rgba(240, 100, 49, 0.11)',
+        'high-light': '0px 8px 28px rgba(240, 100, 49, 0.14)',
+        'focus-light': '0px 0px 28px rgba(173, 62, 44, 0.30)',
+
+        // MCP Shadow System - Dark Mode
+        'low-dark': '0px 1px 3px rgba(0, 0, 0, 0.07)',
+        'medium-dark': '0px 4px 12px rgba(0, 0, 0, 0.10)',
+        'high-dark': '0px 8px 28px rgba(0, 0, 0, 0.15)',
+        'focus-dark': '0px 0px 28px rgba(217, 91, 60, 0.16)',
       },
     },
   },

package/templates/typescript-oauth/src/modules/flights/flights.prompts.ts

@@ -22,33 +22,30 @@ export class FlightPrompts {
         ]
     })
     async flightSearchAssistant(input: any, ctx: ExecutionContext) {
-        const systemPrompt = `You are a professional flight booking assistant with expertise in helping travelers find the best flight options.
+        const systemPrompt = `You are a professional flight booking assistant with expertise in helping travelers find flight information.
+
+⚠️ CRITICAL: Only do what the user specifically asks. Do NOT assume additional steps.
 
 Your capabilities:
+- Search for airports using search_airports tool
 - Search for flights using the search_flights tool
 - Get detailed flight information using get_flight_details tool
-- Search for airports using search_airports tool
-- Explain flight options, pricing, and conditions
-- Help users compare different flight options
-- Provide recommendations based on user preferences
-- Guide users through the booking process
-
-Guidelines:
-1. Always confirm the origin, destination, and dates before searching
-2. Ask about passenger count and cabin class preferences
-3. Explain the differences between flight options clearly
-4. Highlight important details like layovers, total duration, and baggage allowance
-5. Inform users about refund and change policies
-6. Help users understand pricing and what's included
-7. Be proactive in suggesting alternatives if initial search has limited results
-
-BOOKING WORKFLOW:
-When a user wants to book a flight:
+- Help book flights when explicitly requested
+
+**IMPORTANT RULES:**
+1. If user asks about airports, ONLY search airports - do NOT search for flights
+2. If user asks about flights, ONLY search flights - do NOT automatically book
+3. If user asks to book, ONLY then proceed with booking workflow
+4. NEVER chain operations unless user explicitly requests it
+
+**EXAMPLES:**
+- "show me airports in London" → search_airports("London") → show results → STOP
+- "find flights from NYC to LAX" → search_flights → show results → STOP
+- "book this flight" → THEN start booking workflow
+
+BOOKING WORKFLOW (only when user explicitly wants to book):
 1. FIRST, collect ALL passenger information (name, title, gender, date of birth, email, phone)
 2. THEN, call create_order tool with complete passenger details
-   - The system will automatically create a HOLD order (no payment required)
-   - The system will automatically handle passenger ID creation with Duffel
-   - You just need to provide the passenger details in the correct format
 ⚠️ NEVER call create_order without collecting passenger information first!
 ⚠️ All bookings are automatically held - no payment is required at booking time
 
@@ -56,7 +53,7 @@ Current user query: ${input.userQuery}
 
 ${input.context?.previousSearches?.length ? `Previous searches in this conversation:\n${JSON.stringify(input.context.previousSearches, null, 2)}` : ''}
 
-Respond naturally and helpfully to assist the user with their flight booking needs.`;
+Respond to EXACTLY what the user asked - nothing more.`;
 
         return {
             role: 'assistant',

package/dist/cli/build-widgets.mjs

@@ -1,165 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * Custom widget bundler for NitroStack
- * 
- * This script bundles Next.js widget pages into single-file HTML documents
- * with all JavaScript and CSS inlined, following OpenAI's widget spec.
- * 
- * Unlike Next.js static export which creates multiple chunk files,
- * this creates truly self-contained single-file widgets.
- */
-
-import * as esbuild from 'esbuild';
-import * as fs from 'fs';
-import * as path from 'path';
-
-const WIDGETS_DIR = path.resolve(process.cwd(), 'src/widgets');
-const APP_DIR = path.join(WIDGETS_DIR, 'app');
-const OUT_DIR = path.join(WIDGETS_DIR, 'out');
-
-console.log('🎨 Building widgets with esbuild...\n');
-
-// Clean output directory
-if (fs.existsSync(OUT_DIR)) {
-  fs.rmSync(OUT_DIR, { recursive: true });
-}
-fs.mkdirSync(OUT_DIR, { recursive: true });
-
-// Find all widget pages
-const widgetPages = [];
-
-function findWidgetPages(dir, basePath = '') {
-  const entries = fs.readdirSync(dir, { withFileTypes: true });
-
-  for (const entry of entries) {
-    const fullPath = path.join(dir, entry.name);
-    const relativePath = path.join(basePath, entry.name);
-
-    if (entry.isDirectory()) {
-      findWidgetPages(fullPath, relativePath);
-    } else if (entry.name === 'page.tsx' || entry.name === 'page.jsx') {
-      const widgetName = basePath || 'index';
-      widgetPages.push({
-        name: widgetName,
-        entryPoint: fullPath,
-        outputName: widgetName.replace(/\//g, '-')
-      });
-    }
-  }
-}
-
-if (fs.existsSync(APP_DIR)) {
-  findWidgetPages(APP_DIR);
-}
-
-console.log(`Found ${widgetPages.length} widget(s):`);
-widgetPages.forEach(w => console.log(`  - ${w.name}`));
-console.log('');
-
-// Bundle each widget
-for (const widget of widgetPages) {
-  console.log(`📦 Bundling ${widget.name}...`);
-
-  const tempEntry = path.join(OUT_DIR, `_temp_${widget.outputName}.jsx`);
-  const jsOutput = path.join(OUT_DIR, `${widget.outputName}.js`);
-  const htmlOutput = path.join(OUT_DIR, `${widget.outputName}.html`);
-
-  // Create a temporary entry file that renders the widget
-  const entryCode = `
-import React from 'react';
-import { createRoot } from 'react-dom/client';
-import WidgetPage from '${widget.entryPoint.replace(/\\/g, '/')}';
-
-// Wait for DOM to be ready
-if (document.readyState === 'loading') {
-  document.addEventListener('DOMContentLoaded', init);
-} else {
-  init();
-}
-
-function init() {
-  // Get data from window.openai if available
-  const data = window.openai?.toolOutput || {};
-  
-  // Find or create root element
-  let root = document.getElementById('widget-root');
-  if (!root) {
-    root = document.createElement('div');
-    root.id = 'widget-root';
-    document.body.appendChild(root);
-  }
-  
-  // Render the widget
-  const reactRoot = createRoot(root);
-  reactRoot.render(React.createElement(WidgetPage, { data }));
-}
-`;
-
-  fs.writeFileSync(tempEntry, entryCode);
-
-  try {
-    // Bundle with esbuild
-    await esbuild.build({
-      entryPoints: [tempEntry],
-      bundle: true,
-      format: 'iife',
-      outfile: jsOutput,
-      platform: 'browser',
-      target: ['es2020'],
-      minify: true,
-      jsx: 'automatic',
-      jsxImportSource: 'react',
-      // Don't bundle React - it should come from widgets/node_modules
-      external: [],
-      // Resolve modules from the widgets directory
-      nodePaths: [path.join(WIDGETS_DIR, 'node_modules')],
-      define: {
-        'process.env.NODE_ENV': '"production"'
-      },
-      logLevel: 'warning'
-    });
-
-    // Read the bundled JavaScript
-    const bundledJs = fs.readFileSync(jsOutput, 'utf-8');
-
-    // Create the HTML file with inlined JavaScript
-    const html = `<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style>
-    * { box-sizing: border-box; }
-    body { 
-      margin: 0; 
-      padding: 0; 
-      font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-    }
-    #widget-root {
-      width: 100%;
-      min-height: 100vh;
-    }
-  </style>
-</head>
-<body>
-  <div id="widget-root"></div>
-  <script>${bundledJs}</script>
-</body>
-</html>`;
-
-    fs.writeFileSync(htmlOutput, html);
-
-    // Clean up temporary files
-    fs.unlinkSync(tempEntry);
-    fs.unlinkSync(jsOutput);
-
-    console.log(`  ✓ ${widget.outputName}.html`);
-
-  } catch (error) {
-    console.error(`  ✗ Failed to bundle ${widget.name}:`, error.message);
-    process.exit(1);
-  }
-}
-
-console.log(`\n✨ Successfully built ${widgetPages.length} widget(s) to ${OUT_DIR}\n`);