@bytexbyte/nxtlinq-ai-agent-sdk 1.2.4 → 1.2.6

package/README.md

@@ -2,6 +2,14 @@
 
 A powerful AI Agent SDK that supports multiple AI model switching, wallet connection, permission management, and more.
 
+## 🚀 What's New in v1.2.4
+
+- **🎯 AI Model Switching**: Real-time switching between multiple AI models during conversations
+- **🤖 Multi-Model Support**: Support for Nova, Claude, ChatGPT, Llama, and Gemini
+- **🎨 Enhanced UI**: Model selector dropdown and model badges for messages
+- **💾 Persistent Preferences**: Model selection saved in localStorage
+- **🔧 Improved API**: Enhanced API client with dynamic model endpoints
+
 ## Features
 
 - 🤖 **Multiple AI Models Support**: Supports Nova, Claude, ChatGPT, Llama, Gemini, and other AI models
@@ -10,21 +18,39 @@ A powerful AI Agent SDK that supports multiple AI model switching, wallet connec
 - 🔐 **Permission Management**: AIT (AI Identity Token) based permission control system
 - 💬 **Real-time Chat**: Context-aware conversation functionality
 - 🎨 **Customizable UI**: Complete UI components and style customization options
+- 📱 **Responsive Design**: Works seamlessly across different screen sizes
+- 🔒 **Type Safety**: Full TypeScript support with comprehensive type definitions
 
 ## Installation
 
 ```bash
-npm install nxtlinq-ai-agent-sdk
+npm install @bytexbyte/nxtlinq-ai-agent-sdk
 # or
-yarn add nxtlinq-ai-agent-sdk
+yarn add @bytexbyte/nxtlinq-ai-agent-sdk
 ```
 
-## Basic Usage
+## Quick Start
+
+### Basic Configuration
+
+```tsx
+import { ChatBot } from '@bytexbyte/nxtlinq-ai-agent-sdk';
+
+function App() {
+  return (
+    <ChatBot
+      serviceId="your-service-id"
+      apiKey="your-api-key"
+      apiSecret="your-api-secret"
+    />
+  );
+}
+```
 
-### 1. Basic Configuration
+### AI Model Switching
 
 ```tsx
-import { ChatBot } from 'nxtlinq-ai-agent-sdk';
+import { ChatBot, DEFAULT_AI_MODELS } from '@bytexbyte/nxtlinq-ai-agent-sdk';
 
 function App() {
   return (
@@ -32,15 +58,23 @@ function App() {
       serviceId="your-service-id"
       apiKey="your-api-key"
       apiSecret="your-api-secret"
+      // Enable AI model switching
+      showModelSelector={true}
+      defaultModelIndex={0} // Start with Nova
+      onModelChange={(model) => {
+        console.log('Switched to:', model.label);
+        // Track model usage
+        analytics.track('model_changed', { model: model.value });
+      }}
     />
   );
 }
 ```
 
-### 2. Custom AI Models
+### Custom Model Configuration
 
 ```tsx
-import { ChatBot, DEFAULT_AI_MODELS } from 'nxtlinq-ai-agent-sdk';
+import { ChatBot } from '@bytexbyte/nxtlinq-ai-agent-sdk';
 
 function App() {
   // Custom available AI models
@@ -48,7 +82,7 @@ function App() {
     { label: 'Nova', value: 'nova' },
     { label: 'Claude', value: 'claude' },
     { label: 'ChatGPT', value: 'open-ai' },
-    // Add more models...
+    // Add more models as needed
   ];
 
   return (
@@ -60,17 +94,17 @@ function App() {
       defaultModelIndex={1} // Default to Claude
       showModelSelector={true}
       onModelChange={(model) => {
-        console.log('Switched to:', model.label);
+        console.log('Model changed to:', model.label);
       }}
     />
   );
 }
 ```
 
-### 3. Advanced Configuration
+### Advanced Configuration
 
 ```tsx
-import { ChatBot } from 'nxtlinq-ai-agent-sdk';
+import { ChatBot, DEFAULT_AI_MODELS } from '@bytexbyte/nxtlinq-ai-agent-sdk';
 
 function App() {
   return (
@@ -84,18 +118,28 @@ function App() {
       showModelSelector={true}
       onModelChange={(model) => {
         console.log('Model changed to:', model.label);
+        // Update user preferences
+        localStorage.setItem('preferred-model', model.value);
       }}
       // Preset messages
       presetMessages={[
         { text: 'Hello, how can you help me?', autoSend: true },
-        { text: 'I want to know about your services.', autoSend: false }
+        { text: 'I want to switch to a different AI model.', autoSend: false },
+        { text: 'What are the differences between the available models?', autoSend: false }
       ]}
       // Callback functions
       onMessage={(message) => {
-        console.log('New message:', message);
+        console.log('New message:', {
+          content: message.content,
+          role: message.role,
+          model: message.metadata?.model,
+          timestamp: message.timestamp
+        });
       }}
       onError={(error) => {
-        console.error('Error:', error);
+        console.error('ChatBot error:', error);
+        // Add error reporting
+        errorReporting.captureException(error);
       }}
       onToolUse={async (toolUse) => {
         console.log('Tool used:', toolUse);
@@ -128,32 +172,32 @@ function App() {
 
 ### ChatBot Props
 
-| Property | Type | Default | Description |
-|----------|------|---------|-------------|
-| `serviceId` | `string` | - | Service ID (required) |
-| `apiKey` | `string` | - | API Key (required) |
-| `apiSecret` | `string` | - | API Secret (required) |
-| `availableModels` | `AIModel[]` | `DEFAULT_AI_MODELS` | Available AI models list |
-| `defaultModelIndex` | `number` | `0` | Default selected model index |
-| `showModelSelector` | `boolean` | `true` | Whether to show model selector |
-| `onModelChange` | `(model: AIModel) => void` | - | Model change callback |
-| `presetMessages` | `PresetMessage[]` | `[]` | Preset messages list |
-| `placeholder` | `string` | `'Type a message...'` | Input placeholder |
-| `className` | `string` | `''` | Custom CSS class name |
-| `maxRetries` | `number` | `3` | Maximum retry attempts |
-| `retryDelay` | `number` | `1000` | Retry delay (milliseconds) |
-| `onMessage` | `(message: Message) => void` | - | Message callback |
-| `onError` | `(error: Error) => void` | - | Error callback |
-| `onToolUse` | `(toolUse: ToolUse) => Promise<Message \| void>` | - | Tool use callback |
-| `onVerifyWallet` | `() => Promise<{token: string} \| undefined>` | - | Wallet verification callback |
-| `permissionGroup` | `string` | - | Permission group name |
+| Property | Type | Default | Required | Description |
+|----------|------|---------|----------|-------------|
+| `serviceId` | `string` | - | ✅ | Service ID |
+| `apiKey` | `string` | - | ✅ | API Key |
+| `apiSecret` | `string` | - | ✅ | API Secret |
+| `availableModels` | `AIModel[]` | `DEFAULT_AI_MODELS` | ❌ | Available AI models list |
+| `defaultModelIndex` | `number` | `0` | ❌ | Default selected model index |
+| `showModelSelector` | `boolean` | `true` | ❌ | Whether to show model selector |
+| `onModelChange` | `(model: AIModel) => void` | - | ❌ | Model change callback |
+| `presetMessages` | `PresetMessage[]` | `[]` | ❌ | Preset messages list |
+| `placeholder` | `string` | `'Type a message...'` | ❌ | Input placeholder |
+| `className` | `string` | `''` | ❌ | Custom CSS class name |
+| `maxRetries` | `number` | `3` | ❌ | Maximum retry attempts |
+| `retryDelay` | `number` | `1000` | ❌ | Retry delay (milliseconds) |
+| `onMessage` | `(message: Message) => void` | - | ❌ | Message callback |
+| `onError` | `(error: Error) => void` | - | ❌ | Error callback |
+| `onToolUse` | `(toolUse: ToolUse) => Promise<Message \| void>` | - | ❌ | Tool use callback |
+| `onVerifyWallet` | `() => Promise<{token: string} \| undefined>` | - | ❌ | Wallet verification callback |
+| `permissionGroup` | `string` | - | ❌ | Permission group name |
 
 ### AIModel Type
 
 ```typescript
 interface AIModel {
-  label: string;  // Display name
-  value: string;  // Model identifier
+  label: string;  // Display name (e.g., "Nova", "Claude")
+  value: string;  // Model identifier (e.g., "nova", "claude")
 }
 ```
 
@@ -169,6 +213,26 @@ const DEFAULT_AI_MODELS = [
 ];
 ```
 
+### Message Type with Model Metadata
+
+```typescript
+interface Message {
+  id: string;
+  content: string;
+  role: 'user' | 'assistant';
+  timestamp: string;
+  metadata?: {
+    model?: string;           // AI model used
+    permissions?: string[];   // User permissions
+    issuedBy?: string;        // Wallet address
+    toolUse?: {              // Tool call information
+      name: string;
+      input: Record<string, any>;
+    };
+  };
+}
+```
+
 ## Component Usage
 
 ### Using Components Individually
@@ -180,7 +244,7 @@ import {
   ModelSelector,
   MessageList,
   MessageInput 
-} from 'nxtlinq-ai-agent-sdk';
+} from '@bytexbyte/nxtlinq-ai-agent-sdk';
 
 function CustomChatBot() {
   return (
@@ -197,7 +261,7 @@ function CustomChatBot() {
 }
 ```
 
-### Custom Layout
+### Custom Layout with Model Selector
 
 ```tsx
 import { 
@@ -206,7 +270,7 @@ import {
   ModelSelector,
   MessageList,
   MessageInput 
-} from 'nxtlinq-ai-agent-sdk';
+} from '@bytexbyte/nxtlinq-ai-agent-sdk';
 
 function CustomLayout() {
   const { isOpen, setIsOpen } = useChatBot();
@@ -214,7 +278,7 @@ function CustomLayout() {
   if (!isOpen) {
     return (
       <button onClick={() => setIsOpen(true)}>
-        Open Chat
+        Open AI Agent
       </button>
     );
   }
@@ -274,6 +338,11 @@ function App() {
 .nxtlinq-model-selector {
   /* Custom styles */
 }
+
+/* Model badge */
+.nxtlinq-model-badge {
+  /* Custom styles */
+}
 ```
 
 ### Inline Style Override
@@ -287,7 +356,9 @@ function App() {
   style={{
     '--primary-color': '#007bff',
     '--secondary-color': '#6c757d',
-    '--border-radius': '10px'
+    '--border-radius': '10px',
+    '--model-badge-bg': '#e3f2fd',
+    '--model-badge-color': '#1976d2'
   }}
 />
 ```
@@ -303,16 +374,17 @@ function App() {
   apiSecret="your-api-secret"
   onModelChange={(model) => {
     console.log('Model changed to:', model.label);
-    // You can add analytics tracking here
+    // Add analytics tracking
     analytics.track('model_changed', {
       model: model.value,
-      label: model.label
+      label: model.label,
+      timestamp: new Date().toISOString()
     });
   }}
 />
 ```
 
-### Message Events
+### Message Events with Model Information
 
 ```tsx
 <ChatBot
@@ -321,11 +393,18 @@ function App() {
   apiSecret="your-api-secret"
   onMessage={(message) => {
     console.log('New message:', message);
-    // You can add message storage or analytics here
+    // Track message with model info
     if (message.role === 'user') {
       analytics.track('user_message', {
         content: message.content,
-        model: message.metadata?.model
+        model: message.metadata?.model,
+        timestamp: message.timestamp
+      });
+    } else if (message.role === 'assistant') {
+      analytics.track('ai_response', {
+        model: message.metadata?.model,
+        hasToolUse: !!message.metadata?.toolUse,
+        timestamp: message.timestamp
       });
     }
   }}
@@ -341,24 +420,94 @@ function App() {
   apiSecret="your-api-secret"
   onError={(error) => {
     console.error('ChatBot error:', error);
-    // You can add error reporting here
+    // Add error reporting
     errorReporting.captureException(error);
+    
+    // Track error with context
+    analytics.track('chatbot_error', {
+      error: error.message,
+      stack: error.stack,
+      timestamp: new Date().toISOString()
+    });
   }}
 />
 ```
 
 ## Best Practices
 
-1. **Model Selection**: Choose appropriate AI models based on use cases
-2. **Error Handling**: Always provide `onError` callback to handle errors
-3. **User Experience**: Use preset messages to guide users
-4. **Performance Optimization**: Set reasonable retry counts and delays
-5. **Security**: Keep API keys secure and use environment variables
+### 1. Model Selection
+- Choose appropriate AI models based on use cases
+- Consider user preferences and requirements
+- Monitor model performance and usage
+
+### 2. Error Handling
+- Always provide `onError` callback to handle errors
+- Implement proper error reporting and monitoring
+- Provide fallback mechanisms for failed requests
+
+### 3. User Experience
+- Use preset messages to guide users
+- Provide clear model switching feedback
+- Maintain conversation context across model switches
+
+### 4. Performance Optimization
+- Set reasonable retry counts and delays
+- Implement proper loading states
+- Optimize for different network conditions
+
+### 5. Security
+- Keep API keys secure and use environment variables
+- Validate user permissions before tool calls
+- Implement proper wallet verification
+
+## Migration Guide
+
+### From v1.2.3 to v1.2.4
+
+1. **Update package version**:
+   ```bash
+   npm install @bytexbyte/nxtlinq-ai-agent-sdk@1.2.4
+   ```
+
+2. **Add model switching props** (optional):
+   ```tsx
+   <ChatBot
+     // ... existing props
+     showModelSelector={true}
+     onModelChange={(model) => console.log('Model:', model.label)}
+   />
+   ```
+
+3. **Update message handling** (if needed):
+   ```tsx
+   onMessage={(message) => {
+     // Now includes model information
+     console.log('Model used:', message.metadata?.model);
+   }}
+   ```
+
+## Changelog
+
+### v1.2.4 (Latest)
+- ✨ **NEW**: AI model switching functionality
+- ✨ **NEW**: Support for 5 AI models (Nova, Claude, ChatGPT, Llama, Gemini)
+- ✨ **NEW**: ModelSelector dropdown component
+- ✨ **NEW**: Model badges in messages
+- ✨ **NEW**: Persistent model preferences
+- 🔧 **IMPROVED**: Enhanced API client with dynamic endpoints
+- 🔧 **IMPROVED**: Better TypeScript types and interfaces
+- 📚 **UPDATED**: Comprehensive documentation and examples
+
+### v1.2.3
+- Initial release with basic functionality
 
-## License
+## Support
 
-MIT License
+For questions, issues, or feature requests:
+- 📧 Email: support@nxtlinq.ai
+- 📖 Documentation: https://docs.nxtlinq.ai
+- 🐛 Issues: https://github.com/bytexbyte/nxtlinq-ai-agent-sdk/issues
 
-## Support
+## License
 
-For questions or suggestions, please submit an Issue or contact our support team. 
+MIT License - see [LICENSE](LICENSE) file for details. 

package/dist/components/context/ChatBotContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatBotContext.d.ts","sourceRoot":"","sources":["../../../src/components/context/ChatBotContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EACL,kBAAkB,EAClB,YAAY,EAOb,MAAM,uBAAuB,CAAC;AAI/B,eAAO,MAAM,UAAU,0BAMtB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAg6BlD,CAAC"}
+{"version":3,"file":"ChatBotContext.d.ts","sourceRoot":"","sources":["../../../src/components/context/ChatBotContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,EACL,kBAAkB,EAClB,YAAY,EAOb,MAAM,uBAAuB,CAAC;AAI/B,eAAO,MAAM,UAAU,0BAMtB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAqpClD,CAAC"}