@burtson-labs/bandit-engine 2.0.31 → 2.0.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -1
- package/dist/cli/cli.js +1 -1
- package/dist/cli/cli.js.map +1 -1
- package/docs/api_reference/assets/highlight.css +8 -15
- package/docs/api_reference/classes/DebugLogger.html +11 -11
- package/docs/api_reference/classes/FeatureFlagService.html +13 -13
- package/docs/api_reference/classes/NotificationService.html +10 -10
- package/docs/api_reference/classes/StreamingTTSClient.html +9 -9
- package/docs/api_reference/classes/VectorDatabaseService.html +24 -24
- package/docs/api_reference/classes/VectorMigrationService.html +8 -8
- package/docs/api_reference/classes/VoiceService.html +2 -2
- package/docs/api_reference/enums/TTSState.html +2 -2
- package/docs/api_reference/functions/Chat.html +1 -1
- package/docs/api_reference/functions/ChatModal.html +3 -3
- package/docs/api_reference/functions/ChatProvider.html +3 -3
- package/docs/api_reference/functions/FeatureFlagProvider.html +3 -3
- package/docs/api_reference/functions/FeedbackButton.html +3 -3
- package/docs/api_reference/functions/FeedbackModal.html +3 -3
- package/docs/api_reference/functions/Management.html +1 -1
- package/docs/api_reference/functions/NotificationProvider.html +3 -3
- package/docs/api_reference/functions/SubscriptionExpiredGuard.html +3 -3
- package/docs/api_reference/functions/SubscriptionExpiredModal.html +3 -3
- package/docs/api_reference/functions/defineCustomElement.html +1 -1
- package/docs/api_reference/functions/getCriticalConfig.html +1 -1
- package/docs/api_reference/functions/getFeatureMatrix.html +1 -1
- package/docs/api_reference/functions/getStreamingTTSClient.html +1 -1
- package/docs/api_reference/functions/getSystemConstants.html +1 -1
- package/docs/api_reference/functions/getTTSState.html +1 -1
- package/docs/api_reference/functions/handleHttpError.html +1 -1
- package/docs/api_reference/functions/handleSubscriptionUpgrade.html +1 -1
- package/docs/api_reference/functions/handleValidationError.html +1 -1
- package/docs/api_reference/functions/initializeCoreSystem.html +1 -1
- package/docs/api_reference/functions/pauseTTS.html +1 -1
- package/docs/api_reference/functions/previewTierUpgrade.html +1 -1
- package/docs/api_reference/functions/resumeTTS.html +1 -1
- package/docs/api_reference/functions/showInfoNotification.html +1 -1
- package/docs/api_reference/functions/showSuccessNotification.html +1 -1
- package/docs/api_reference/functions/speakWithStreaming.html +1 -1
- package/docs/api_reference/functions/stopTTS.html +1 -1
- package/docs/api_reference/functions/syncSubscriptionWithAPI.html +1 -1
- package/docs/api_reference/functions/updateSubscriptionTier.html +1 -1
- package/docs/api_reference/functions/useFeatureFlag.html +1 -1
- package/docs/api_reference/functions/useFeatureVisibility.html +1 -1
- package/docs/api_reference/functions/useFeatures.html +1 -1
- package/docs/api_reference/functions/useGatewayHealth.html +1 -1
- package/docs/api_reference/functions/useGatewayMemory.html +1 -1
- package/docs/api_reference/functions/useGatewayModels.html +1 -1
- package/docs/api_reference/functions/useGlobalTTS.html +1 -1
- package/docs/api_reference/functions/useNotification.html +1 -1
- package/docs/api_reference/functions/useNotificationService.html +1 -1
- package/docs/api_reference/functions/useTTS.html +1 -1
- package/docs/api_reference/functions/useVectorStore.html +1 -1
- package/docs/api_reference/functions/useVoiceStore.html +2 -2
- package/docs/api_reference/functions/useVoices.html +1 -1
- package/docs/api_reference/functions/validateEnvironment.html +1 -1
- package/docs/api_reference/functions/validateSystemIntegrity.html +1 -1
- package/docs/api_reference/index.html +10 -10
- package/docs/api_reference/interfaces/AIChatRequest.html +2 -2
- package/docs/api_reference/interfaces/AIChatResponse.html +2 -2
- package/docs/api_reference/interfaces/AIGenerateRequest.html +2 -2
- package/docs/api_reference/interfaces/AIGenerateResponse.html +2 -2
- package/docs/api_reference/interfaces/AIMessage.html +2 -2
- package/docs/api_reference/interfaces/AIModel.html +2 -2
- package/docs/api_reference/interfaces/AIProviderConfig.html +2 -2
- package/docs/api_reference/interfaces/ChatConfig.html +3 -3
- package/docs/api_reference/interfaces/ChatModalProps.html +3 -3
- package/docs/api_reference/interfaces/CreateMemoryOptions.html +2 -2
- package/docs/api_reference/interfaces/FeatureEvaluation.html +7 -7
- package/docs/api_reference/interfaces/FeatureFlagConfig.html +9 -9
- package/docs/api_reference/interfaces/FeatureFlagContextValue.html +8 -8
- package/docs/api_reference/interfaces/FeatureFlagProviderProps.html +2 -2
- package/docs/api_reference/interfaces/FeedbackButtonProps.html +10 -10
- package/docs/api_reference/interfaces/FeedbackCategories.html +2 -2
- package/docs/api_reference/interfaces/FeedbackModalProps.html +2 -2
- package/docs/api_reference/interfaces/FeedbackPriorities.html +2 -2
- package/docs/api_reference/interfaces/FeedbackRequest.html +2 -2
- package/docs/api_reference/interfaces/FeedbackResponse.html +2 -2
- package/docs/api_reference/interfaces/FileUploadResult.html +2 -2
- package/docs/api_reference/interfaces/GatewayChatRequest.html +2 -2
- package/docs/api_reference/interfaces/GatewayChatResponse.html +2 -2
- package/docs/api_reference/interfaces/GatewayContract.html +2 -2
- package/docs/api_reference/interfaces/GatewayGenerateRequest.html +2 -2
- package/docs/api_reference/interfaces/GatewayGenerateResponse.html +2 -2
- package/docs/api_reference/interfaces/GatewayHealthResponse.html +2 -2
- package/docs/api_reference/interfaces/GatewayMemoryRecord.html +2 -2
- package/docs/api_reference/interfaces/GatewayMemoryResponse.html +2 -2
- package/docs/api_reference/interfaces/GatewayMessage.html +2 -2
- package/docs/api_reference/interfaces/GatewayMessageContent.html +2 -2
- package/docs/api_reference/interfaces/GatewayModel.html +2 -2
- package/docs/api_reference/interfaces/GatewayModelsResponse.html +2 -2
- package/docs/api_reference/interfaces/MemorySearchFilters.html +2 -2
- package/docs/api_reference/interfaces/MigrationProgress.html +2 -2
- package/docs/api_reference/interfaces/MigrationStatus.html +2 -2
- package/docs/api_reference/interfaces/NotificationConfig.html +2 -2
- package/docs/api_reference/interfaces/NotificationContextType.html +2 -2
- package/docs/api_reference/interfaces/NotificationProviderProps.html +2 -2
- package/docs/api_reference/interfaces/PackageSettings.html +2 -2
- package/docs/api_reference/interfaces/SearchOptions.html +2 -2
- package/docs/api_reference/interfaces/SearchResult.html +2 -2
- package/docs/api_reference/interfaces/SubscriptionExpiredGuardProps.html +2 -2
- package/docs/api_reference/interfaces/SubscriptionExpiredModalProps.html +2 -2
- package/docs/api_reference/interfaces/TTSOptions.html +2 -2
- package/docs/api_reference/interfaces/TTSProgress.html +2 -2
- package/docs/api_reference/interfaces/TrialUsage.html +2 -2
- package/docs/api_reference/interfaces/UploadRequest.html +3 -3
- package/docs/api_reference/interfaces/UseTTSReturn.html +2 -2
- package/docs/api_reference/interfaces/VectorDocument.html +2 -2
- package/docs/api_reference/interfaces/VectorMemory.html +2 -2
- package/docs/api_reference/interfaces/VectorMemoryMetadata.html +2 -2
- package/docs/api_reference/interfaces/VectorStoreStatus.html +2 -2
- package/docs/api_reference/interfaces/VoiceModelsResponse.html +2 -2
- package/docs/api_reference/interfaces/VoiceState.html +2 -2
- package/docs/api_reference/types/FeatureKey.html +1 -1
- package/docs/api_reference/types/FeatureMatrix.html +1 -1
- package/docs/api_reference/types/GatewayQueryOptions.html +1 -1
- package/docs/api_reference/types/LogContext.html +1 -1
- package/docs/api_reference/types/SubscriptionTier.html +1 -1
- package/docs/api_reference/variables/DEFAULT_TIER_FEATURES.html +1 -1
- package/docs/api_reference/variables/FeatureFlagContext.html +1 -1
- package/docs/api_reference/variables/OSS_DEFAULT_FEATURES.html +1 -1
- package/docs/api_reference/variables/SYSTEM_FLAGS.html +1 -1
- package/docs/api_reference/variables/authenticationService.html +1 -1
- package/docs/api_reference/variables/debugLogger-1.html +1 -1
- package/docs/api_reference/variables/featureFlagService-1.html +1 -1
- package/docs/api_reference/variables/notificationService-1.html +1 -1
- package/docs/api_reference/variables/vectorDatabaseService-1.html +1 -1
- package/docs/api_reference/variables/vectorMigrationService-1.html +1 -1
- package/docs/api_reference/variables/voiceService-1.html +1 -1
- package/package.json +1 -1
|
@@ -191,7 +191,7 @@ VITE_GATEWAY_PROVIDER=ollama
|
|
|
191
191
|
<p>VITE_DEFAULT_MODEL=llava:latest # any model installed on your Ollama box
|
|
192
192
|
VITE_FALLBACK_MODEL=gemma2:9b-instruct # optional, but handy for text-only fallbacks</p>
|
|
193
193
|
<a id="md:gateway--server" class="tsd-anchor"></a><h1 class="tsd-anchor-link">Gateway / server<a href="#md:gateway--server" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><p>OLLAMA_URL=<a href="http://localhost:11434" target="_blank" class="external">http://localhost:11434</a> # or the remote daemon address</p>
|
|
194
|
-
<pre><code><br/><br/><span class="hl-1"><</span><span class="hl-5">p</span><span class="hl-1"> </span><span class="hl-5">class</span><span class="hl-1">=</span><span class="hl-2">"gateway-note"</span><span class="hl-1">></span><span class="hl-5">Set</span><span class="hl-1"> <</span><span class="hl-5">code</span><span class="hl-1">></span><span class="hl-7">VITE_DEFAULT_MODEL</span><span class="hl-1"><</span><span class="hl-13">/code> /</span><span class="hl-1"> <</span><span class="hl-5">code</span><span class="hl-1">></span><span class="hl-7">VITE_FALLBACK_MODEL</span><span class="hl-1"></</span><span class="hl-5">code</span><span class="hl-1">> </span><span class="hl-5">to</span><span class="hl-1"> </span><span class="hl-5">the</span><span class="hl-1"> </span><span class="hl-5">exact</span><span class="hl-1"> </span><span class="hl-5">Ollama</span><span class="hl-1"> </span><span class="hl-5">model</span><span class="hl-1"> </span><span class="hl-5">tags</span><span class="hl-1"> </span><span class="hl-5">you</span><span class="hl-1"> </span><span class="hl-5">have</span><span class="hl-1"> </span><span class="hl-0">available</span><span class="hl-1"> (<</span><span class="hl-10">code</span><span class="hl-1">></span><span class="hl-5">gemma</span><span class="hl-1"></</span><span class="hl-5">code</span><span class="hl-1">>, <</span><span class="hl-10">code</span><span class="hl-1">></span><span class="hl-5">llava</span><span class="hl-1"></</span><span class="hl-5">code</span><span class="hl-1">>, <</span><span class="hl-10">code</span><span class="hl-1">></span><span class="hl-5">moondream</span><span class="hl-1"></</span><span class="hl-5">code</span><span class="hl-1">>, </span><span class="hl-5">or</span><span class="hl-1"> </span><span class="hl-5">your</span><span class="hl-1"> </span><span class="hl-5">own</span><span class="hl-1"> </span><span class="hl-5">custom</span><span class="hl-1"> </span><span class="hl-5">builds</span><span class="hl-1">). </span><span class="hl-5">Bandit</span><span class="hl-1"> </span><span class="hl-5">automatically</span><span class="hl-1"> </span><span class="hl-5">detects</span><span class="hl-1"> </span><span class="hl-5">multimodal</span><span class="hl-1"> </span><span class="hl-5">Ollama</span><span class="hl-1"> </span><span class="hl-5">models</span><span class="hl-1">, </span><span class="hl-5">so</span><span class="hl-1"> </span><span class="hl-5">setting</span><span class="hl-1"> <</span><span class="hl-5">code</span><span class="hl-1">></span><span class="hl-5">llava</span><span class="hl-1"></</span><span class="hl-5">code</span><span class="hl-1">>, <</span><span class="hl-10">code</span><span class="hl-1">></span><span class="hl-5">moondream</span><span class="hl-1"></</span><span class="hl-5">code</span><span class="hl-1">>, </span><span class="hl-5">or</span><span class="hl-1"> </span><span class="hl-5">other</span><span class="hl-1"> </span><span class="hl-5">vision</span><span class="hl-1">-</span><span class="hl-5">capable</span><span class="hl-1"> </span><span class="hl-5">variants</span><span class="hl-1"> </span><span class="hl-5">enables</span><span class="hl-1"> </span><span class="hl-5">image</span><span class="hl-1"> </span><span class="hl-5">understanding</span><span class="hl-1"> </span><span class="hl-4">with</span><span class="hl-1"> </span><span class="hl-5">no</span><span class="hl-1"> </span><span class="hl-5">extra</span><span class="hl-1"> </span><span class="hl-5">code</span><span class="hl-1">.</</span><span class="hl-5">p</span><span class="hl-1">></span><br/><br/><span class="hl-1">### 🎤 </span><span class="hl-5">Voice</span><span class="hl-1"> </span><span class="hl-0">Services</span><span class="hl-1"> (</span><span class="hl-7">TTS</span><span class="hl-1">/</span><span class="hl-7">STT</span><span class="hl-1">)</span><br/><br/><span class="hl-5">The</span><span class="hl-1"> </span><span class="hl-5">Bandit</span><span class="hl-1"> </span><span class="hl-5">Engine</span><span class="hl-1"> </span><span class="hl-5">supports</span><span class="hl-1"> </span><span class="hl-5">Text</span><span class="hl-1">-</span><span class="hl-5">to</span><span class="hl-1">-</span><span class="hl-0">Speech</span><span class="hl-1"> (</span><span class="hl-7">TTS</span><span class="hl-1">) </span><span class="hl-5">and</span><span class="hl-1"> </span><span class="hl-5">Speech</span><span class="hl-1">-</span><span class="hl-5">to</span><span class="hl-1">-</span><span class="hl-0">Text</span><span class="hl-1"> (</span><span class="hl-7">STT</span><span class="hl-1">) </span><span class="hl-5">through</span><span class="hl-1"> </span><span class="hl-5">your</span><span class="hl-1"> </span><span class="hl-5">gateway</span><span class="hl-1"> </span><span class="hl-7">API</span><span class="hl-1">. </span><span class="hl-5">These</span><span class="hl-1"> </span><span class="hl-5">services</span><span class="hl-1"> </span><span class="hl-5">are</span><span class="hl-1"> **</span><span class="hl-5">technology</span><span class="hl-1">-</span><span class="hl-5">agnostic</span><span class="hl-1">** - </span><span class="hl-5">you</span><span class="hl-1"> </span><span class="hl-5">can</span><span class="hl-1"> </span><span class="hl-5">implement</span><span class="hl-1"> </span><span class="hl-5">them</span><span class="hl-1"> </span><span class="hl-6">using</span><span class="hl-1"> </span><span class="hl-7">any</span><span class="hl-1"> backend technology:</span><br/><br/><span class="hl-1">**</span><span class="hl-10">TTS</span><span class="hl-1"> </span><span class="hl-10">Endpoint</span><span class="hl-1"> (</span><span class="hl-2">`POST /api/tts`</span><span class="hl-1">)**</span><br/><span class="hl-1">- **</span><span class="hl-10">Input</span><span class="hl-1">**: </span><span class="hl-2">`{ text: string, voice?: string, speed?: number }`</span><br/><span class="hl-1">- **</span><span class="hl-10">Output</span><span class="hl-1">**: </span><span class="hl-10">Audio</span><span class="hl-1"> </span><span class="hl-10">file</span><span class="hl-1"> (</span><span class="hl-5">MP3</span><span class="hl-1">, </span><span class="hl-5">WAV</span><span class="hl-1">, etc.) </span><span class="hl-10">or</span><span class="hl-1"> </span><span class="hl-10">streaming</span><span class="hl-1"> </span><span class="hl-10">audio</span><br/><span class="hl-1">- **</span><span class="hl-10">Compatible</span><span class="hl-1"> </span><span class="hl-10">with</span><span class="hl-1">**: </span><span class="hl-10">OpenAI</span><span class="hl-1"> </span><span class="hl-10">TTS</span><span class="hl-1">, </span><span class="hl-7">Azure</span><span class="hl-1"> Speech, </span><span class="hl-7">Google</span><span class="hl-1"> Cloud TTS, </span><span class="hl-7">AWS</span><span class="hl-1"> Polly, </span><span class="hl-7">local</span><span class="hl-1"> TTS servers, </span><span class="hl-7">or</span><span class="hl-1"> custom implementations</span><br/><br/><span class="hl-1">**</span><span class="hl-7">STT</span><span class="hl-1"> </span><span class="hl-0">Endpoint</span><span class="hl-1"> (</span><span class="hl-2">`POST /api/stt/transcribe`</span><span class="hl-1">)** </span><br/><span class="hl-1">- **</span><span class="hl-5">Input</span><span class="hl-1">**: </span><span class="hl-5">Audio</span><span class="hl-1"> </span><span class="hl-5">file</span><span class="hl-1"> </span><span class="hl-0">upload</span><span class="hl-1"> (</span><span class="hl-5">multipart</span><span class="hl-1">/</span><span class="hl-5">form</span><span class="hl-1">-</span><span class="hl-5">data</span><span class="hl-1">)</span><br/><span class="hl-1">- **</span><span class="hl-5">Output</span><span class="hl-1">**: </span><span class="hl-2">`{ text: string }`</span><span class="hl-1"> </span><span class="hl-5">or</span><span class="hl-1"> </span><span class="hl-2">`{ transcription: string }`</span><br/><span class="hl-1">- **</span><span class="hl-5">Compatible</span><span class="hl-1"> </span><span class="hl-4">with</span><span class="hl-1">**: </span><span class="hl-5">OpenAI</span><span class="hl-1"> </span><span class="hl-5">Whisper</span><span class="hl-1">, </span><span class="hl-5">Azure</span><span class="hl-1"> </span><span class="hl-5">Speech</span><span class="hl-1">, </span><span class="hl-5">Google</span><span class="hl-1"> </span><span class="hl-5">Speech</span><span class="hl-1">, </span><span class="hl-7">AWS</span><span class="hl-1"> </span><span class="hl-5">Transcribe</span><span class="hl-1">, </span><span class="hl-5">local</span><span class="hl-1"> </span><span class="hl-5">Whisper</span><span class="hl-1"> </span><span class="hl-5">servers</span><span class="hl-1">, </span><span class="hl-5">or</span><span class="hl-1"> </span><span class="hl-5">custom</span><span class="hl-1"> </span><span class="hl-5">implementations</span><br/><br/><span class="hl-1">**</span><span class="hl-5">Service</span><span class="hl-1"> </span><span class="hl-0">Discovery</span><span class="hl-1"> (</span><span class="hl-2">`GET /api/tts/available-models`</span><span class="hl-1">)**</span><br/><span class="hl-1">- **</span><span class="hl-5">Output</span><span class="hl-1">**: </span><span class="hl-2">`{ models: string[], defaultModel: string, fallbackModel: string }`</span><br/><span class="hl-1">- </span><span class="hl-5">Used</span><span class="hl-1"> </span><span class="hl-5">for</span><span class="hl-1"> </span><span class="hl-5">automatic</span><span class="hl-1"> </span><span class="hl-5">service</span><span class="hl-1"> </span><span class="hl-5">availability</span><span class="hl-1"> </span><span class="hl-5">detection</span><span class="hl-1"> </span><span class="hl-5">and</span><span class="hl-1"> </span><span class="hl-5">voice</span><span class="hl-1"> </span><span class="hl-5">model</span><span class="hl-1"> </span><span class="hl-5">selection</span><br/><br/><span class="hl-1">> </span><span class="hl-5">Quickstart</span><span class="hl-1"> </span><span class="hl-12">note</span><span class="hl-1">: </span><span class="hl-5">the</span><span class="hl-1"> </span><span class="hl-5">generated</span><span class="hl-1"> </span><span class="hl-5">Express</span><span class="hl-1"> </span><span class="hl-5">gateway</span><span class="hl-1"> </span><span class="hl-5">ships</span><span class="hl-1"> </span><span class="hl-5">these</span><span class="hl-1"> </span><span class="hl-7">TTS</span><span class="hl-1">/</span><span class="hl-7">STT</span><span class="hl-1"> </span><span class="hl-5">routes</span><span class="hl-1"> </span><span class="hl-4">as</span><span class="hl-1"> </span><span class="hl-2">`501`</span><span class="hl-1"> </span><span class="hl-10">placeholders</span><span class="hl-1"> </span><span class="hl-10">so</span><span class="hl-1"> </span><span class="hl-10">you</span><span class="hl-1"> </span><span class="hl-10">can</span><span class="hl-1"> </span><span class="hl-10">connect</span><span class="hl-1"> </span><span class="hl-10">your</span><span class="hl-1"> </span><span class="hl-10">own</span><span class="hl-1"> </span><span class="hl-10">provider</span><span class="hl-1">. </span><span class="hl-10">Voice</span><span class="hl-1"> </span><span class="hl-10">features</span><span class="hl-1"> </span><span class="hl-10">remain</span><span class="hl-1"> </span><span class="hl-10">disabled</span><span class="hl-1"> </span><span class="hl-10">until</span><span class="hl-1"> </span><span class="hl-10">you</span><span class="hl-1"> </span><span class="hl-10">implement</span><span class="hl-1"> </span><span class="hl-10">them</span><span class="hl-1"> </span><span class="hl-10">server</span><span class="hl-1">-</span><span class="hl-5">side</span><span class="hl-1">.</span><br/><br/><span class="hl-5">See</span><span class="hl-1"> </span><span class="hl-5">the</span><span class="hl-1"> [</span><span class="hl-5">Gateway</span><span class="hl-1"> </span><span class="hl-7">API</span><span class="hl-1"> </span><span class="hl-5">Contract</span><span class="hl-1">](</span><span class="hl-5">media</span><span class="hl-1">/02</span><span class="hl-5">_gateway_api</span><span class="hl-1">.</span><span class="hl-5">md</span><span class="hl-1">) </span><span class="hl-5">for</span><span class="hl-1"> </span><span class="hl-5">complete</span><span class="hl-1"> </span><span class="hl-5">implementation</span><span class="hl-1"> </span><span class="hl-5">examples</span><span class="hl-1"> </span><span class="hl-6">in</span><span class="hl-1"> </span><span class="hl-5">multiple</span><span class="hl-1"> </span><span class="hl-5">languages</span><span class="hl-1">.</span><br/><br/><span class="hl-5">Use</span><span class="hl-1"> </span><span class="hl-5">the</span><span class="hl-1"> </span><span class="hl-5">Management</span><span class="hl-1"> </span><span class="hl-6">interface</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">switch</span><span class="hl-1"> </span><span class="hl-10">providers</span><span class="hl-1"> </span><span class="hl-10">anytime</span><span class="hl-1"> </span><span class="hl-10">or</span><span class="hl-1"> </span><span class="hl-10">migrate</span><span class="hl-1"> </span><span class="hl-10">from</span><span class="hl-1"> </span><span class="hl-10">direct</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">gateway</span><span class="hl-1"> </span><span class="hl-10">setup</span><span class="hl-1">.</span><br/><br/><span class="hl-1">3. **</span><span class="hl-10">Development</span><span class="hl-1">**</span><br/><br/><span class="hl-1">- </span><span class="hl-10">Use</span><span class="hl-1"> `</span><span class="hl-10">npm</span><span class="hl-1"> </span><span class="hl-10">link</span><span class="hl-1">` </span><span class="hl-10">or</span><span class="hl-1"> </span><span class="hl-10">a</span><span class="hl-1"> </span><span class="hl-10">monorepo</span><span class="hl-1"> </span><span class="hl-10">workspace</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">test</span><span class="hl-1"> </span><span class="hl-10">locally</span><span class="hl-1"> </span><span class="hl-10">before</span><span class="hl-1"> </span><span class="hl-10">publishing</span><span class="hl-1">.</span><br/><span class="hl-1">- </span><span class="hl-10">Build</span><span class="hl-1"> </span><span class="hl-10">with</span><span class="hl-1"> `</span><span class="hl-10">tsup</span><span class="hl-1">`.</span><br/><br/><span class="hl-1">---</span><br/><br/><span class="hl-1">## 🧩 </span><span class="hl-10">Consuming</span><span class="hl-1"> </span><span class="hl-10">the</span><span class="hl-1"> </span><span class="hl-10">Components</span><br/><br/><span class="hl-10">Once</span><span class="hl-1"> </span><span class="hl-10">you</span><span class="hl-1">'</span><span class="hl-10">ve</span><span class="hl-1"> </span><span class="hl-10">wrapped</span><span class="hl-1"> </span><span class="hl-10">your</span><span class="hl-1"> </span><span class="hl-10">app</span><span class="hl-1"> </span><span class="hl-10">with</span><span class="hl-1"> `</span><span class="hl-10">ChatProvider</span><span class="hl-1">`, </span><span class="hl-10">you</span><span class="hl-1"> </span><span class="hl-10">can</span><span class="hl-1"> </span><span class="hl-10">selectively</span><span class="hl-1"> </span><span class="hl-10">integrate</span><span class="hl-1"> </span><span class="hl-10">Bandit</span><span class="hl-1">'</span><span class="hl-10">s</span><span class="hl-1"> </span><span class="hl-10">components</span><span class="hl-1"> </span><span class="hl-10">as</span><span class="hl-1"> </span><span class="hl-10">needed</span><span class="hl-1">:</span><br/><br/><span class="hl-1">- `<</span><span class="hl-10">Chat</span><span class="hl-1"> />`: </span><span class="hl-10">The</span><span class="hl-1"> </span><span class="hl-10">main</span><span class="hl-1"> </span><span class="hl-10">chat</span><span class="hl-1"> </span><span class="hl-10">interface</span><span class="hl-1">, </span><span class="hl-10">designed</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">be</span><span class="hl-1"> </span><span class="hl-10">used</span><span class="hl-1"> </span><span class="hl-10">on</span><span class="hl-1"> </span><span class="hl-10">a</span><span class="hl-1"> </span><span class="hl-10">dedicated</span><span class="hl-1"> </span><span class="hl-10">page</span><span class="hl-1"> </span><span class="hl-10">or</span><span class="hl-1"> </span><span class="hl-10">embedded</span><span class="hl-1"> </span><span class="hl-10">into</span><span class="hl-1"> </span><span class="hl-10">your</span><span class="hl-1"> </span><span class="hl-10">product</span><span class="hl-1">.</span><br/><span class="hl-1">- `<</span><span class="hl-10">Management</span><span class="hl-1"> />`: </span><span class="hl-10">A</span><span class="hl-1"> </span><span class="hl-10">full</span><span class="hl-1">-</span><span class="hl-10">featured</span><span class="hl-1"> </span><span class="hl-10">admin</span><span class="hl-1"> </span><span class="hl-10">and</span><span class="hl-1"> </span><span class="hl-10">model</span><span class="hl-1"> </span><span class="hl-10">configuration</span><span class="hl-1"> </span><span class="hl-10">UI</span><span class="hl-1">. </span><span class="hl-10">This</span><span class="hl-1"> </span><span class="hl-10">should</span><span class="hl-1"> </span><span class="hl-10">not</span><span class="hl-1"> </span><span class="hl-10">be</span><span class="hl-1"> </span><span class="hl-10">on</span><span class="hl-1"> </span><span class="hl-10">the</span><span class="hl-1"> </span><span class="hl-10">same</span><span class="hl-1"> </span><span class="hl-10">page</span><span class="hl-1"> </span><span class="hl-10">as</span><span class="hl-1"> `<</span><span class="hl-10">Chat</span><span class="hl-1"> />`. </span><span class="hl-10">Use</span><span class="hl-1"> </span><span class="hl-10">this</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">allow</span><span class="hl-1"> </span><span class="hl-10">authenticated</span><span class="hl-1"> </span><span class="hl-10">users</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">manage</span><span class="hl-1"> </span><span class="hl-10">themes</span><span class="hl-1">, </span><span class="hl-10">models</span><span class="hl-1">, </span><span class="hl-10">and</span><span class="hl-1"> </span><span class="hl-10">embedded</span><span class="hl-1"> </span><span class="hl-10">knowledge</span><span class="hl-1">.</span><br/><span class="hl-1">- `<</span><span class="hl-10">ChatModal</span><span class="hl-1"> />`: </span><span class="hl-10">A</span><span class="hl-1"> </span><span class="hl-10">flexible</span><span class="hl-1">, </span><span class="hl-10">mobile</span><span class="hl-1">-</span><span class="hl-10">friendly</span><span class="hl-1"> </span><span class="hl-10">modal</span><span class="hl-1"> </span><span class="hl-10">that</span><span class="hl-1"> </span><span class="hl-10">can</span><span class="hl-1"> </span><span class="hl-10">be</span><span class="hl-1"> </span><span class="hl-10">launched</span><span class="hl-1"> </span><span class="hl-10">anywhere</span><span class="hl-1"> </span><span class="hl-10">in</span><span class="hl-1"> </span><span class="hl-10">your</span><span class="hl-1"> </span><span class="hl-10">app</span><span class="hl-1"> </span><span class="hl-10">for</span><span class="hl-1"> </span><span class="hl-10">quick</span><span class="hl-1"> </span><span class="hl-10">AI</span><span class="hl-1"> </span><span class="hl-10">interactions</span><span class="hl-1">. </span><span class="hl-10">Features</span><span class="hl-1"> </span><span class="hl-10">include</span><span class="hl-1">:</span><br/><span class="hl-1">- **</span><span class="hl-10">Chat</span><span class="hl-1"> </span><span class="hl-10">Control</span><span class="hl-1"> </span><span class="hl-10">Center</span><span class="hl-1">**: </span><span class="hl-10">Built</span><span class="hl-1">-</span><span class="hl-10">in</span><span class="hl-1"> </span><span class="hl-10">conversation</span><span class="hl-1"> </span><span class="hl-10">management</span><span class="hl-1">, </span><span class="hl-10">voice</span><span class="hl-1"> </span><span class="hl-10">model</span><span class="hl-1"> </span><span class="hl-10">switching</span><span class="hl-1">, </span><span class="hl-10">and</span><span class="hl-1"> </span><span class="hl-10">memory</span><span class="hl-1"> </span><span class="hl-10">controls</span><br/><span class="hl-1">- **</span><span class="hl-10">Context</span><span class="hl-1"> </span><span class="hl-10">Switching</span><span class="hl-1">**: </span><span class="hl-10">Toggle</span><span class="hl-1"> </span><span class="hl-10">between</span><span class="hl-1"> </span><span class="hl-10">local</span><span class="hl-1"> </span><span class="hl-10">session</span><span class="hl-1"> </span><span class="hl-10">and</span><span class="hl-1"> </span><span class="hl-10">saved</span><span class="hl-1"> </span><span class="hl-10">conversation</span><span class="hl-1"> </span><span class="hl-10">history</span><span class="hl-1"> </span><br/><span class="hl-1">- **</span><span class="hl-10">Voice</span><span class="hl-1"> </span><span class="hl-10">Integration</span><span class="hl-1">**: </span><span class="hl-10">Voice</span><span class="hl-1"> </span><span class="hl-10">model</span><span class="hl-1"> </span><span class="hl-10">selection</span><span class="hl-1"> </span><span class="hl-10">with</span><span class="hl-1"> </span><span class="hl-10">real</span><span class="hl-1">-</span><span class="hl-10">time</span><span class="hl-1"> </span><span class="hl-10">preview</span><span class="hl-1"> (</span><span class="hl-10">when</span><span class="hl-1"> </span><span class="hl-10">TTS</span><span class="hl-1"> </span><span class="hl-10">is</span><span class="hl-1"> </span><span class="hl-10">configured</span><span class="hl-1">)</span><br/><span class="hl-1">- **</span><span class="hl-10">Navigation</span><span class="hl-1">**: </span><span class="hl-10">Seamless</span><span class="hl-1"> </span><span class="hl-10">transition</span><span class="hl-1"> </span><span class="hl-10">from</span><span class="hl-1"> </span><span class="hl-10">modal</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">full</span><span class="hl-1"> </span><span class="hl-10">chat</span><span class="hl-1"> </span><span class="hl-10">interface</span><br/><span class="hl-1">- **</span><span class="hl-10">Auto</span><span class="hl-1">-</span><span class="hl-10">theming</span><span class="hl-1">**: </span><span class="hl-10">Automatically</span><span class="hl-1"> </span><span class="hl-10">uses</span><span class="hl-1"> </span><span class="hl-10">the</span><span class="hl-1"> </span><span class="hl-10">theme</span><span class="hl-1"> </span><span class="hl-10">configured</span><span class="hl-1"> </span><span class="hl-10">in</span><span class="hl-1"> </span><span class="hl-10">the</span><span class="hl-1"> </span><span class="hl-10">Management</span><span class="hl-1"> </span><span class="hl-10">interface</span><br/><br/><span class="hl-1">```</span><span class="hl-10">tsx</span><br/><span class="hl-10">import</span><span class="hl-1"> { </span><span class="hl-5">Chat</span><span class="hl-1">, </span><span class="hl-5">Management</span><span class="hl-1">, </span><span class="hl-5">ChatModal</span><span class="hl-1">, </span><span class="hl-5">ChatProvider</span><span class="hl-1"> } </span><span class="hl-5">from</span><span class="hl-1"> </span><span class="hl-2">'@burtson-labs/bandit-engine'</span><span class="hl-1">;</span><br/><span class="hl-4">import</span><span class="hl-1"> { </span><span class="hl-5">useState</span><span class="hl-1"> } </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">'react'</span><span class="hl-1">;</span><br/><br/><span class="hl-6">function</span><span class="hl-1"> </span><span class="hl-0">YourPage</span><span class="hl-1">() {</span><br/><span class="hl-6">const</span><span class="hl-1"> [</span><span class="hl-7">isModalOpen</span><span class="hl-1">, </span><span class="hl-7">setIsModalOpen</span><span class="hl-1">] = </span><span class="hl-0">useState</span><span class="hl-1">(</span><span class="hl-6">false</span><span class="hl-1">);</span><br/><br/><span class="hl-4">return</span><span class="hl-1"> (</span><br/><span class="hl-1"> <></span><br/><span class="hl-1"> <</span><span class="hl-5">Chat</span><span class="hl-1"> /></span><br/><span class="hl-1"> {</span><span class="hl-8">/* Use <Management /> on a separate admin route with access controls */</span><span class="hl-1">}</span><br/><span class="hl-1"> </span><br/><span class="hl-1"> {</span><span class="hl-8">/* Trigger the AI modal anywhere in your app */</span><span class="hl-1">}</span><br/><span class="hl-1"> <</span><span class="hl-5">button</span><span class="hl-1"> </span><span class="hl-5">onClick</span><span class="hl-1">={() => </span><span class="hl-0">setIsModalOpen</span><span class="hl-1">(</span><span class="hl-5">true</span><span class="hl-1">)}></span><br/><span class="hl-1"> </span><span class="hl-5">Ask</span><span class="hl-1"> </span><span class="hl-5">AI</span><br/><span class="hl-1"> </</span><span class="hl-5">button</span><span class="hl-1">></span><br/><span class="hl-1"> <</span><span class="hl-5">ChatModal</span><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-5">open</span><span class="hl-1">={</span><span class="hl-5">isModalOpen</span><span class="hl-1">} </span><br/><span class="hl-1"> </span><span class="hl-5">onClose</span><span class="hl-1">={() => </span><span class="hl-0">setIsModalOpen</span><span class="hl-1">(</span><span class="hl-5">false</span><span class="hl-1">)}</span><br/><span class="hl-1"> /></span><br/><span class="hl-1"> </></span><br/><span class="hl-1">);</span><br/><span class="hl-1">}</span>
|
|
194
|
+
<pre><code><br/><br/><span class="hl-1">> **</span><span class="hl-5">Gateway</span><span class="hl-1"> </span><span class="hl-5">tip</span><span class="hl-1">** </span><br/><span class="hl-1">> </span><span class="hl-5">Set</span><span class="hl-1"> </span><span class="hl-2">`VITE_DEFAULT_MODEL`</span><span class="hl-1"> / </span><span class="hl-2">`VITE_FALLBACK_MODEL`</span><span class="hl-1"> </span><span class="hl-5">to</span><span class="hl-1"> </span><span class="hl-5">the</span><span class="hl-1"> </span><span class="hl-5">exact</span><span class="hl-1"> </span><span class="hl-5">Ollama</span><span class="hl-1"> </span><span class="hl-5">model</span><span class="hl-1"> </span><span class="hl-5">tags</span><span class="hl-1"> </span><span class="hl-5">you</span><span class="hl-1"> </span><span class="hl-5">have</span><span class="hl-1"> </span><span class="hl-0">available</span><span class="hl-1"> (</span><span class="hl-2">`gemma`</span><span class="hl-1">, </span><span class="hl-2">`llava`</span><span class="hl-1">, </span><span class="hl-2">`moondream`</span><span class="hl-1">, </span><span class="hl-5">or</span><span class="hl-1"> </span><span class="hl-5">your</span><span class="hl-1"> </span><span class="hl-5">own</span><span class="hl-1"> </span><span class="hl-5">custom</span><span class="hl-1"> </span><span class="hl-5">builds</span><span class="hl-1">). </span><span class="hl-5">Bandit</span><span class="hl-1"> </span><span class="hl-5">automatically</span><span class="hl-1"> </span><span class="hl-5">detects</span><span class="hl-1"> </span><span class="hl-5">multimodal</span><span class="hl-1"> </span><span class="hl-5">Ollama</span><span class="hl-1"> </span><span class="hl-5">models</span><span class="hl-1">, </span><span class="hl-5">so</span><span class="hl-1"> </span><span class="hl-5">using</span><span class="hl-1"> </span><span class="hl-2">`llava`</span><span class="hl-1">, </span><span class="hl-2">`moondream`</span><span class="hl-1">, </span><span class="hl-5">or</span><span class="hl-1"> </span><span class="hl-5">other</span><span class="hl-1"> </span><span class="hl-5">vision</span><span class="hl-1">-</span><span class="hl-5">capable</span><span class="hl-1"> </span><span class="hl-5">variants</span><span class="hl-1"> </span><span class="hl-5">enables</span><span class="hl-1"> </span><span class="hl-5">image</span><span class="hl-1"> </span><span class="hl-5">understanding</span><span class="hl-1"> </span><span class="hl-4">with</span><span class="hl-1"> </span><span class="hl-5">no</span><span class="hl-1"> </span><span class="hl-5">extra</span><span class="hl-1"> </span><span class="hl-5">code</span><span class="hl-1">.</span><br/><br/><span class="hl-1">### 🎤 </span><span class="hl-5">Voice</span><span class="hl-1"> </span><span class="hl-0">Services</span><span class="hl-1"> (</span><span class="hl-7">TTS</span><span class="hl-1">/</span><span class="hl-7">STT</span><span class="hl-1">)</span><br/><br/><span class="hl-5">The</span><span class="hl-1"> </span><span class="hl-5">Bandit</span><span class="hl-1"> </span><span class="hl-5">Engine</span><span class="hl-1"> </span><span class="hl-5">supports</span><span class="hl-1"> </span><span class="hl-5">Text</span><span class="hl-1">-</span><span class="hl-5">to</span><span class="hl-1">-</span><span class="hl-0">Speech</span><span class="hl-1"> (</span><span class="hl-7">TTS</span><span class="hl-1">) </span><span class="hl-5">and</span><span class="hl-1"> </span><span class="hl-5">Speech</span><span class="hl-1">-</span><span class="hl-5">to</span><span class="hl-1">-</span><span class="hl-0">Text</span><span class="hl-1"> (</span><span class="hl-7">STT</span><span class="hl-1">) </span><span class="hl-5">through</span><span class="hl-1"> </span><span class="hl-5">your</span><span class="hl-1"> </span><span class="hl-5">gateway</span><span class="hl-1"> </span><span class="hl-7">API</span><span class="hl-1">. </span><span class="hl-5">These</span><span class="hl-1"> </span><span class="hl-5">services</span><span class="hl-1"> </span><span class="hl-5">are</span><span class="hl-1"> **</span><span class="hl-5">technology</span><span class="hl-1">-</span><span class="hl-5">agnostic</span><span class="hl-1">** - </span><span class="hl-5">you</span><span class="hl-1"> </span><span class="hl-5">can</span><span class="hl-1"> </span><span class="hl-5">implement</span><span class="hl-1"> </span><span class="hl-5">them</span><span class="hl-1"> </span><span class="hl-6">using</span><span class="hl-1"> </span><span class="hl-7">any</span><span class="hl-1"> backend technology:</span><br/><br/><span class="hl-1">**</span><span class="hl-10">TTS</span><span class="hl-1"> </span><span class="hl-10">Endpoint</span><span class="hl-1"> (</span><span class="hl-2">`POST /api/tts`</span><span class="hl-1">)**</span><br/><span class="hl-1">- **</span><span class="hl-10">Input</span><span class="hl-1">**: </span><span class="hl-2">`{ text: string, voice?: string, speed?: number }`</span><br/><span class="hl-1">- **</span><span class="hl-10">Output</span><span class="hl-1">**: </span><span class="hl-10">Audio</span><span class="hl-1"> </span><span class="hl-10">file</span><span class="hl-1"> (</span><span class="hl-5">MP3</span><span class="hl-1">, </span><span class="hl-5">WAV</span><span class="hl-1">, etc.) </span><span class="hl-10">or</span><span class="hl-1"> </span><span class="hl-10">streaming</span><span class="hl-1"> </span><span class="hl-10">audio</span><br/><span class="hl-1">- **</span><span class="hl-10">Compatible</span><span class="hl-1"> </span><span class="hl-10">with</span><span class="hl-1">**: </span><span class="hl-10">OpenAI</span><span class="hl-1"> </span><span class="hl-10">TTS</span><span class="hl-1">, </span><span class="hl-7">Azure</span><span class="hl-1"> Speech, </span><span class="hl-7">Google</span><span class="hl-1"> Cloud TTS, </span><span class="hl-7">AWS</span><span class="hl-1"> Polly, </span><span class="hl-7">local</span><span class="hl-1"> TTS servers, </span><span class="hl-7">or</span><span class="hl-1"> custom implementations</span><br/><br/><span class="hl-1">**</span><span class="hl-7">STT</span><span class="hl-1"> </span><span class="hl-0">Endpoint</span><span class="hl-1"> (</span><span class="hl-2">`POST /api/stt/transcribe`</span><span class="hl-1">)** </span><br/><span class="hl-1">- **</span><span class="hl-5">Input</span><span class="hl-1">**: </span><span class="hl-5">Audio</span><span class="hl-1"> </span><span class="hl-5">file</span><span class="hl-1"> </span><span class="hl-0">upload</span><span class="hl-1"> (</span><span class="hl-5">multipart</span><span class="hl-1">/</span><span class="hl-5">form</span><span class="hl-1">-</span><span class="hl-5">data</span><span class="hl-1">)</span><br/><span class="hl-1">- **</span><span class="hl-5">Output</span><span class="hl-1">**: </span><span class="hl-2">`{ text: string }`</span><span class="hl-1"> </span><span class="hl-5">or</span><span class="hl-1"> </span><span class="hl-2">`{ transcription: string }`</span><br/><span class="hl-1">- **</span><span class="hl-5">Compatible</span><span class="hl-1"> </span><span class="hl-4">with</span><span class="hl-1">**: </span><span class="hl-5">OpenAI</span><span class="hl-1"> </span><span class="hl-5">Whisper</span><span class="hl-1">, </span><span class="hl-5">Azure</span><span class="hl-1"> </span><span class="hl-5">Speech</span><span class="hl-1">, </span><span class="hl-5">Google</span><span class="hl-1"> </span><span class="hl-5">Speech</span><span class="hl-1">, </span><span class="hl-7">AWS</span><span class="hl-1"> </span><span class="hl-5">Transcribe</span><span class="hl-1">, </span><span class="hl-5">local</span><span class="hl-1"> </span><span class="hl-5">Whisper</span><span class="hl-1"> </span><span class="hl-5">servers</span><span class="hl-1">, </span><span class="hl-5">or</span><span class="hl-1"> </span><span class="hl-5">custom</span><span class="hl-1"> </span><span class="hl-5">implementations</span><br/><br/><span class="hl-1">**</span><span class="hl-5">Service</span><span class="hl-1"> </span><span class="hl-0">Discovery</span><span class="hl-1"> (</span><span class="hl-2">`GET /api/tts/available-models`</span><span class="hl-1">)**</span><br/><span class="hl-1">- **</span><span class="hl-5">Output</span><span class="hl-1">**: </span><span class="hl-2">`{ models: string[], defaultModel: string, fallbackModel: string }`</span><br/><span class="hl-1">- </span><span class="hl-5">Used</span><span class="hl-1"> </span><span class="hl-5">for</span><span class="hl-1"> </span><span class="hl-5">automatic</span><span class="hl-1"> </span><span class="hl-5">service</span><span class="hl-1"> </span><span class="hl-5">availability</span><span class="hl-1"> </span><span class="hl-5">detection</span><span class="hl-1"> </span><span class="hl-5">and</span><span class="hl-1"> </span><span class="hl-5">voice</span><span class="hl-1"> </span><span class="hl-5">model</span><span class="hl-1"> </span><span class="hl-5">selection</span><br/><br/><span class="hl-1">> </span><span class="hl-5">Quickstart</span><span class="hl-1"> </span><span class="hl-12">note</span><span class="hl-1">: </span><span class="hl-5">the</span><span class="hl-1"> </span><span class="hl-5">generated</span><span class="hl-1"> </span><span class="hl-5">Express</span><span class="hl-1"> </span><span class="hl-5">gateway</span><span class="hl-1"> </span><span class="hl-5">ships</span><span class="hl-1"> </span><span class="hl-5">these</span><span class="hl-1"> </span><span class="hl-7">TTS</span><span class="hl-1">/</span><span class="hl-7">STT</span><span class="hl-1"> </span><span class="hl-5">routes</span><span class="hl-1"> </span><span class="hl-4">as</span><span class="hl-1"> </span><span class="hl-2">`501`</span><span class="hl-1"> </span><span class="hl-10">placeholders</span><span class="hl-1"> </span><span class="hl-10">so</span><span class="hl-1"> </span><span class="hl-10">you</span><span class="hl-1"> </span><span class="hl-10">can</span><span class="hl-1"> </span><span class="hl-10">connect</span><span class="hl-1"> </span><span class="hl-10">your</span><span class="hl-1"> </span><span class="hl-10">own</span><span class="hl-1"> </span><span class="hl-10">provider</span><span class="hl-1">. </span><span class="hl-10">Voice</span><span class="hl-1"> </span><span class="hl-10">features</span><span class="hl-1"> </span><span class="hl-10">remain</span><span class="hl-1"> </span><span class="hl-10">disabled</span><span class="hl-1"> </span><span class="hl-10">until</span><span class="hl-1"> </span><span class="hl-10">you</span><span class="hl-1"> </span><span class="hl-10">implement</span><span class="hl-1"> </span><span class="hl-10">them</span><span class="hl-1"> </span><span class="hl-10">server</span><span class="hl-1">-</span><span class="hl-5">side</span><span class="hl-1">.</span><br/><br/><span class="hl-5">See</span><span class="hl-1"> </span><span class="hl-5">the</span><span class="hl-1"> [</span><span class="hl-5">Gateway</span><span class="hl-1"> </span><span class="hl-7">API</span><span class="hl-1"> </span><span class="hl-5">Contract</span><span class="hl-1">](</span><span class="hl-5">media</span><span class="hl-1">/02</span><span class="hl-5">_gateway_api</span><span class="hl-1">.</span><span class="hl-5">md</span><span class="hl-1">) </span><span class="hl-5">for</span><span class="hl-1"> </span><span class="hl-5">complete</span><span class="hl-1"> </span><span class="hl-5">implementation</span><span class="hl-1"> </span><span class="hl-5">examples</span><span class="hl-1"> </span><span class="hl-6">in</span><span class="hl-1"> </span><span class="hl-5">multiple</span><span class="hl-1"> </span><span class="hl-5">languages</span><span class="hl-1">.</span><br/><br/><span class="hl-5">Use</span><span class="hl-1"> </span><span class="hl-5">the</span><span class="hl-1"> </span><span class="hl-5">Management</span><span class="hl-1"> </span><span class="hl-6">interface</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">switch</span><span class="hl-1"> </span><span class="hl-10">providers</span><span class="hl-1"> </span><span class="hl-10">anytime</span><span class="hl-1"> </span><span class="hl-10">or</span><span class="hl-1"> </span><span class="hl-10">migrate</span><span class="hl-1"> </span><span class="hl-10">from</span><span class="hl-1"> </span><span class="hl-10">direct</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">gateway</span><span class="hl-1"> </span><span class="hl-10">setup</span><span class="hl-1">.</span><br/><br/><span class="hl-1">3. **</span><span class="hl-10">Development</span><span class="hl-1">**</span><br/><br/><span class="hl-1">- </span><span class="hl-10">Use</span><span class="hl-1"> `</span><span class="hl-10">npm</span><span class="hl-1"> </span><span class="hl-10">link</span><span class="hl-1">` </span><span class="hl-10">or</span><span class="hl-1"> </span><span class="hl-10">a</span><span class="hl-1"> </span><span class="hl-10">monorepo</span><span class="hl-1"> </span><span class="hl-10">workspace</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">test</span><span class="hl-1"> </span><span class="hl-10">locally</span><span class="hl-1"> </span><span class="hl-10">before</span><span class="hl-1"> </span><span class="hl-10">publishing</span><span class="hl-1">.</span><br/><span class="hl-1">- </span><span class="hl-10">Build</span><span class="hl-1"> </span><span class="hl-10">with</span><span class="hl-1"> `</span><span class="hl-10">tsup</span><span class="hl-1">`.</span><br/><br/><span class="hl-1">---</span><br/><br/><span class="hl-1">## 🧩 </span><span class="hl-10">Consuming</span><span class="hl-1"> </span><span class="hl-10">the</span><span class="hl-1"> </span><span class="hl-10">Components</span><br/><br/><span class="hl-10">Once</span><span class="hl-1"> </span><span class="hl-10">you</span><span class="hl-1">'</span><span class="hl-10">ve</span><span class="hl-1"> </span><span class="hl-10">wrapped</span><span class="hl-1"> </span><span class="hl-10">your</span><span class="hl-1"> </span><span class="hl-10">app</span><span class="hl-1"> </span><span class="hl-10">with</span><span class="hl-1"> `</span><span class="hl-10">ChatProvider</span><span class="hl-1">`, </span><span class="hl-10">you</span><span class="hl-1"> </span><span class="hl-10">can</span><span class="hl-1"> </span><span class="hl-10">selectively</span><span class="hl-1"> </span><span class="hl-10">integrate</span><span class="hl-1"> </span><span class="hl-10">Bandit</span><span class="hl-1">'</span><span class="hl-10">s</span><span class="hl-1"> </span><span class="hl-10">components</span><span class="hl-1"> </span><span class="hl-10">as</span><span class="hl-1"> </span><span class="hl-10">needed</span><span class="hl-1">:</span><br/><br/><span class="hl-1">- `<</span><span class="hl-10">Chat</span><span class="hl-1"> />`: </span><span class="hl-10">The</span><span class="hl-1"> </span><span class="hl-10">main</span><span class="hl-1"> </span><span class="hl-10">chat</span><span class="hl-1"> </span><span class="hl-10">interface</span><span class="hl-1">, </span><span class="hl-10">designed</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">be</span><span class="hl-1"> </span><span class="hl-10">used</span><span class="hl-1"> </span><span class="hl-10">on</span><span class="hl-1"> </span><span class="hl-10">a</span><span class="hl-1"> </span><span class="hl-10">dedicated</span><span class="hl-1"> </span><span class="hl-10">page</span><span class="hl-1"> </span><span class="hl-10">or</span><span class="hl-1"> </span><span class="hl-10">embedded</span><span class="hl-1"> </span><span class="hl-10">into</span><span class="hl-1"> </span><span class="hl-10">your</span><span class="hl-1"> </span><span class="hl-10">product</span><span class="hl-1">.</span><br/><span class="hl-1">- `<</span><span class="hl-10">Management</span><span class="hl-1"> />`: </span><span class="hl-10">A</span><span class="hl-1"> </span><span class="hl-10">full</span><span class="hl-1">-</span><span class="hl-10">featured</span><span class="hl-1"> </span><span class="hl-10">admin</span><span class="hl-1"> </span><span class="hl-10">and</span><span class="hl-1"> </span><span class="hl-10">model</span><span class="hl-1"> </span><span class="hl-10">configuration</span><span class="hl-1"> </span><span class="hl-10">UI</span><span class="hl-1">. </span><span class="hl-10">This</span><span class="hl-1"> </span><span class="hl-10">should</span><span class="hl-1"> </span><span class="hl-10">not</span><span class="hl-1"> </span><span class="hl-10">be</span><span class="hl-1"> </span><span class="hl-10">on</span><span class="hl-1"> </span><span class="hl-10">the</span><span class="hl-1"> </span><span class="hl-10">same</span><span class="hl-1"> </span><span class="hl-10">page</span><span class="hl-1"> </span><span class="hl-10">as</span><span class="hl-1"> `<</span><span class="hl-10">Chat</span><span class="hl-1"> />`. </span><span class="hl-10">Use</span><span class="hl-1"> </span><span class="hl-10">this</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">allow</span><span class="hl-1"> </span><span class="hl-10">authenticated</span><span class="hl-1"> </span><span class="hl-10">users</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">manage</span><span class="hl-1"> </span><span class="hl-10">themes</span><span class="hl-1">, </span><span class="hl-10">models</span><span class="hl-1">, </span><span class="hl-10">and</span><span class="hl-1"> </span><span class="hl-10">embedded</span><span class="hl-1"> </span><span class="hl-10">knowledge</span><span class="hl-1">.</span><br/><span class="hl-1">- `<</span><span class="hl-10">ChatModal</span><span class="hl-1"> />`: </span><span class="hl-10">A</span><span class="hl-1"> </span><span class="hl-10">flexible</span><span class="hl-1">, </span><span class="hl-10">mobile</span><span class="hl-1">-</span><span class="hl-10">friendly</span><span class="hl-1"> </span><span class="hl-10">modal</span><span class="hl-1"> </span><span class="hl-10">that</span><span class="hl-1"> </span><span class="hl-10">can</span><span class="hl-1"> </span><span class="hl-10">be</span><span class="hl-1"> </span><span class="hl-10">launched</span><span class="hl-1"> </span><span class="hl-10">anywhere</span><span class="hl-1"> </span><span class="hl-10">in</span><span class="hl-1"> </span><span class="hl-10">your</span><span class="hl-1"> </span><span class="hl-10">app</span><span class="hl-1"> </span><span class="hl-10">for</span><span class="hl-1"> </span><span class="hl-10">quick</span><span class="hl-1"> </span><span class="hl-10">AI</span><span class="hl-1"> </span><span class="hl-10">interactions</span><span class="hl-1">. </span><span class="hl-10">Features</span><span class="hl-1"> </span><span class="hl-10">include</span><span class="hl-1">:</span><br/><span class="hl-1">- **</span><span class="hl-10">Chat</span><span class="hl-1"> </span><span class="hl-10">Control</span><span class="hl-1"> </span><span class="hl-10">Center</span><span class="hl-1">**: </span><span class="hl-10">Built</span><span class="hl-1">-</span><span class="hl-10">in</span><span class="hl-1"> </span><span class="hl-10">conversation</span><span class="hl-1"> </span><span class="hl-10">management</span><span class="hl-1">, </span><span class="hl-10">voice</span><span class="hl-1"> </span><span class="hl-10">model</span><span class="hl-1"> </span><span class="hl-10">switching</span><span class="hl-1">, </span><span class="hl-10">and</span><span class="hl-1"> </span><span class="hl-10">memory</span><span class="hl-1"> </span><span class="hl-10">controls</span><br/><span class="hl-1">- **</span><span class="hl-10">Context</span><span class="hl-1"> </span><span class="hl-10">Switching</span><span class="hl-1">**: </span><span class="hl-10">Toggle</span><span class="hl-1"> </span><span class="hl-10">between</span><span class="hl-1"> </span><span class="hl-10">local</span><span class="hl-1"> </span><span class="hl-10">session</span><span class="hl-1"> </span><span class="hl-10">and</span><span class="hl-1"> </span><span class="hl-10">saved</span><span class="hl-1"> </span><span class="hl-10">conversation</span><span class="hl-1"> </span><span class="hl-10">history</span><span class="hl-1"> </span><br/><span class="hl-1">- **</span><span class="hl-10">Voice</span><span class="hl-1"> </span><span class="hl-10">Integration</span><span class="hl-1">**: </span><span class="hl-10">Voice</span><span class="hl-1"> </span><span class="hl-10">model</span><span class="hl-1"> </span><span class="hl-10">selection</span><span class="hl-1"> </span><span class="hl-10">with</span><span class="hl-1"> </span><span class="hl-10">real</span><span class="hl-1">-</span><span class="hl-10">time</span><span class="hl-1"> </span><span class="hl-10">preview</span><span class="hl-1"> (</span><span class="hl-10">when</span><span class="hl-1"> </span><span class="hl-10">TTS</span><span class="hl-1"> </span><span class="hl-10">is</span><span class="hl-1"> </span><span class="hl-10">configured</span><span class="hl-1">)</span><br/><span class="hl-1">- **</span><span class="hl-10">Navigation</span><span class="hl-1">**: </span><span class="hl-10">Seamless</span><span class="hl-1"> </span><span class="hl-10">transition</span><span class="hl-1"> </span><span class="hl-10">from</span><span class="hl-1"> </span><span class="hl-10">modal</span><span class="hl-1"> </span><span class="hl-10">to</span><span class="hl-1"> </span><span class="hl-10">full</span><span class="hl-1"> </span><span class="hl-10">chat</span><span class="hl-1"> </span><span class="hl-10">interface</span><br/><span class="hl-1">- **</span><span class="hl-10">Auto</span><span class="hl-1">-</span><span class="hl-10">theming</span><span class="hl-1">**: </span><span class="hl-10">Automatically</span><span class="hl-1"> </span><span class="hl-10">uses</span><span class="hl-1"> </span><span class="hl-10">the</span><span class="hl-1"> </span><span class="hl-10">theme</span><span class="hl-1"> </span><span class="hl-10">configured</span><span class="hl-1"> </span><span class="hl-10">in</span><span class="hl-1"> </span><span class="hl-10">the</span><span class="hl-1"> </span><span class="hl-10">Management</span><span class="hl-1"> </span><span class="hl-10">interface</span><br/><br/><span class="hl-1">```</span><span class="hl-10">tsx</span><br/><span class="hl-10">import</span><span class="hl-1"> { </span><span class="hl-5">Chat</span><span class="hl-1">, </span><span class="hl-5">Management</span><span class="hl-1">, </span><span class="hl-5">ChatModal</span><span class="hl-1">, </span><span class="hl-5">ChatProvider</span><span class="hl-1"> } </span><span class="hl-5">from</span><span class="hl-1"> </span><span class="hl-2">'@burtson-labs/bandit-engine'</span><span class="hl-1">;</span><br/><span class="hl-4">import</span><span class="hl-1"> { </span><span class="hl-5">useState</span><span class="hl-1"> } </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">'react'</span><span class="hl-1">;</span><br/><br/><span class="hl-6">function</span><span class="hl-1"> </span><span class="hl-0">YourPage</span><span class="hl-1">() {</span><br/><span class="hl-6">const</span><span class="hl-1"> [</span><span class="hl-7">isModalOpen</span><span class="hl-1">, </span><span class="hl-7">setIsModalOpen</span><span class="hl-1">] = </span><span class="hl-0">useState</span><span class="hl-1">(</span><span class="hl-6">false</span><span class="hl-1">);</span><br/><br/><span class="hl-4">return</span><span class="hl-1"> (</span><br/><span class="hl-1"> <></span><br/><span class="hl-1"> <</span><span class="hl-5">Chat</span><span class="hl-1"> /></span><br/><span class="hl-1"> {</span><span class="hl-8">/* Use <Management /> on a separate admin route with access controls */</span><span class="hl-1">}</span><br/><span class="hl-1"> </span><br/><span class="hl-1"> {</span><span class="hl-8">/* Trigger the AI modal anywhere in your app */</span><span class="hl-1">}</span><br/><span class="hl-1"> <</span><span class="hl-5">button</span><span class="hl-1"> </span><span class="hl-5">onClick</span><span class="hl-1">={() => </span><span class="hl-0">setIsModalOpen</span><span class="hl-1">(</span><span class="hl-5">true</span><span class="hl-1">)}></span><br/><span class="hl-1"> </span><span class="hl-5">Ask</span><span class="hl-1"> </span><span class="hl-5">AI</span><br/><span class="hl-1"> </</span><span class="hl-5">button</span><span class="hl-1">></span><br/><span class="hl-1"> <</span><span class="hl-5">ChatModal</span><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-5">open</span><span class="hl-1">={</span><span class="hl-5">isModalOpen</span><span class="hl-1">} </span><br/><span class="hl-1"> </span><span class="hl-5">onClose</span><span class="hl-1">={() => </span><span class="hl-0">setIsModalOpen</span><span class="hl-1">(</span><span class="hl-5">false</span><span class="hl-1">)}</span><br/><span class="hl-1"> /></span><br/><span class="hl-1"> </></span><br/><span class="hl-1">);</span><br/><span class="hl-1">}</span>
|
|
195
195
|
</code><button>Copy</button></pre>
|
|
196
196
|
|
|
197
197
|
<a id="md:🛠️-utility-functions--hooks" class="tsd-anchor"></a><h3 class="tsd-anchor-link">🛠️ Utility Functions & Hooks<a href="#md:🛠️-utility-functions--hooks" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>Bandit Engine exports several utility functions for advanced use cases:</p>
|
|
@@ -200,7 +200,7 @@ VITE_FALLBACK_MODEL=gemma2:9b-instruct # optional, but handy for text-only fallb
|
|
|
200
200
|
</code><button type="button">Copy</button></pre>
|
|
201
201
|
|
|
202
202
|
<a id="md:ai-prompt-utilities" class="tsd-anchor"></a><h4 class="tsd-anchor-link">AI Prompt Utilities<a href="#md:ai-prompt-utilities" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h4><p>Access the same prompt functions used internally:</p>
|
|
203
|
-
<pre><code class="tsx"><span class="hl-4">import</span><span class="hl-1"> { </span><br/><span class="hl-1"> </span><span class="hl-5">generateConversationStarters</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">detectMessageMood</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">detectUserInterestAndExcitement</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">summarizeDocument</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">determineRelevantDocuments</span><span class="hl-1"> </span><br/><span class="hl-1">} </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">'@burtson-labs/bandit-engine'</span><span class="hl-1">;</span><br/><br/><span class="hl-8">// Generate conversation starters</span><br/><span class="hl-6">const</span><span class="hl-1"> </span><span class="hl-7">starters</span><span class="hl-1"> = </span><span class="hl-4">await</span><span class="hl-1"> </span><span class="hl-0">generateConversationStarters</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-5">limit:</span><span class="hl-1"> </span><span class="hl-
|
|
203
|
+
<pre><code class="tsx"><span class="hl-4">import</span><span class="hl-1"> { </span><br/><span class="hl-1"> </span><span class="hl-5">generateConversationStarters</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">detectMessageMood</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">detectUserInterestAndExcitement</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">summarizeDocument</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">determineRelevantDocuments</span><span class="hl-1"> </span><br/><span class="hl-1">} </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">'@burtson-labs/bandit-engine'</span><span class="hl-1">;</span><br/><br/><span class="hl-8">// Generate conversation starters</span><br/><span class="hl-6">const</span><span class="hl-1"> </span><span class="hl-7">starters</span><span class="hl-1"> = </span><span class="hl-4">await</span><span class="hl-1"> </span><span class="hl-0">generateConversationStarters</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-5">limit:</span><span class="hl-1"> </span><span class="hl-13">5</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">topicOfInterest:</span><span class="hl-1"> </span><span class="hl-2">"technology, coding, AI"</span><br/><span class="hl-1">});</span><br/><br/><span class="hl-8">// Detect user mood for adaptive responses</span><br/><span class="hl-6">const</span><span class="hl-1"> </span><span class="hl-7">mood</span><span class="hl-1"> = </span><span class="hl-4">await</span><span class="hl-1"> </span><span class="hl-0">detectMessageMood</span><span class="hl-1">(</span><span class="hl-2">"I'm so excited about this project!"</span><span class="hl-1">);</span><br/><span class="hl-8">// Returns: "high" | "neutral" | "low"</span>
|
|
204
204
|
</code><button type="button">Copy</button></pre>
|
|
205
205
|
|
|
206
206
|
<a id="md:datetime-context" class="tsd-anchor"></a><h4 class="tsd-anchor-link">Date/Time Context<a href="#md:datetime-context" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h4><p>All AI interactions automatically include current date/time context to improve relevance and accuracy of responses.</p>
|
|
@@ -236,7 +236,7 @@ In Angular or Vue, you may need to wrap each usage with a <code><bandit-chat-
|
|
|
236
236
|
<li><strong>Memory Management Modal</strong>: Full CRUD operations for memory entries</li>
|
|
237
237
|
</ul>
|
|
238
238
|
<p><strong>Example Usage:</strong></p>
|
|
239
|
-
<pre><code class="tsx"><span class="hl-4">import</span><span class="hl-1"> { </span><span class="hl-5">ChatModal</span><span class="hl-1"> } </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">'@burtson-labs/bandit-engine'</span><span class="hl-1">;</span><br/><br/><span class="hl-6">function</span><span class="hl-1"> </span><span class="hl-0">App</span><span class="hl-1">() {</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> [</span><span class="hl-7">modalOpen</span><span class="hl-1">, </span><span class="hl-7">setModalOpen</span><span class="hl-1">] = </span><span class="hl-0">useState</span><span class="hl-1">(</span><span class="hl-6">false</span><span class="hl-1">);</span><br/><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-4">return</span><span class="hl-1"> (</span><br/><span class="hl-1"> </span><span class="hl-9"><></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-
|
|
239
|
+
<pre><code class="tsx"><span class="hl-4">import</span><span class="hl-1"> { </span><span class="hl-5">ChatModal</span><span class="hl-1"> } </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">'@burtson-labs/bandit-engine'</span><span class="hl-1">;</span><br/><br/><span class="hl-6">function</span><span class="hl-1"> </span><span class="hl-0">App</span><span class="hl-1">() {</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> [</span><span class="hl-7">modalOpen</span><span class="hl-1">, </span><span class="hl-7">setModalOpen</span><span class="hl-1">] = </span><span class="hl-0">useState</span><span class="hl-1">(</span><span class="hl-6">false</span><span class="hl-1">);</span><br/><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-4">return</span><span class="hl-1"> (</span><br/><span class="hl-1"> </span><span class="hl-9"><></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-14">button</span><span class="hl-1"> </span><span class="hl-11">onClick</span><span class="hl-1">=</span><span class="hl-6">{</span><span class="hl-15">() </span><span class="hl-6">=></span><span class="hl-15"> </span><span class="hl-0">setModalOpen</span><span class="hl-15">(</span><span class="hl-6">true</span><span class="hl-15">)</span><span class="hl-6">}</span><span class="hl-9">></span><br/><span class="hl-1"> Open AI Assistant</span><br/><span class="hl-1"> </span><span class="hl-9"></</span><span class="hl-14">button</span><span class="hl-9">></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-10">ChatModal</span><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-11">open</span><span class="hl-1">=</span><span class="hl-6">{</span><span class="hl-5">modalOpen</span><span class="hl-6">}</span><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-11">onClose</span><span class="hl-1">=</span><span class="hl-6">{</span><span class="hl-15">() </span><span class="hl-6">=></span><span class="hl-15"> </span><span class="hl-0">setModalOpen</span><span class="hl-15">(</span><span class="hl-6">false</span><span class="hl-15">)</span><span class="hl-6">}</span><br/><span class="hl-1"> </span><span class="hl-8">// Chat Control Center is automatically included</span><br/><span class="hl-1"> </span><span class="hl-9">/></span><br/><span class="hl-1"> </span><span class="hl-9"></></span><br/><span class="hl-1"> );</span><br/><span class="hl-1">}</span>
|
|
240
240
|
</code><button type="button">Copy</button></pre>
|
|
241
241
|
|
|
242
242
|
<a id="md:📧-feedback-system" class="tsd-anchor"></a><h3 class="tsd-anchor-link">📧 Feedback System<a href="#md:📧-feedback-system" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>The Bandit Engine includes a comprehensive feedback system that can be configured and customized for your application.</p>
|
|
@@ -245,7 +245,7 @@ In Angular or Vue, you may need to wrap each usage with a <code><bandit-chat-
|
|
|
245
245
|
</code><button type="button">Copy</button></pre>
|
|
246
246
|
|
|
247
247
|
<p><strong>Standalone Usage:</strong></p>
|
|
248
|
-
<pre><code class="tsx"><span class="hl-4">import</span><span class="hl-1"> { </span><span class="hl-5">FeedbackButton</span><span class="hl-1"> } </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">'@burtson-labs/bandit-engine'</span><span class="hl-1">;</span><br/><br/><span class="hl-8">// Floating FAB button (default)</span><br/><span class="hl-9"><</span><span class="hl-10">FeedbackButton</span><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-11">feedbackEmail</span><span class="hl-1">=</span><span class="hl-2">"support@myapp.com"</span><span class="hl-1"> </span><span class="hl-8">// Optional: override default</span><br/><span class="hl-1"> </span><span class="hl-11">size</span><span class="hl-1">=</span><span class="hl-2">"small"</span><span class="hl-1"> </span><span class="hl-8">// small | medium | large</span><br/><span class="hl-1"> </span><span class="hl-11">position</span><span class="hl-1">=</span><span class="hl-6">{</span><span class="hl-
|
|
248
|
+
<pre><code class="tsx"><span class="hl-4">import</span><span class="hl-1"> { </span><span class="hl-5">FeedbackButton</span><span class="hl-1"> } </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">'@burtson-labs/bandit-engine'</span><span class="hl-1">;</span><br/><br/><span class="hl-8">// Floating FAB button (default)</span><br/><span class="hl-9"><</span><span class="hl-10">FeedbackButton</span><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-11">feedbackEmail</span><span class="hl-1">=</span><span class="hl-2">"support@myapp.com"</span><span class="hl-1"> </span><span class="hl-8">// Optional: override default</span><br/><span class="hl-1"> </span><span class="hl-11">size</span><span class="hl-1">=</span><span class="hl-2">"small"</span><span class="hl-1"> </span><span class="hl-8">// small | medium | large</span><br/><span class="hl-1"> </span><span class="hl-11">position</span><span class="hl-1">=</span><span class="hl-6">{</span><span class="hl-15">{ </span><span class="hl-5">bottom:</span><span class="hl-15"> </span><span class="hl-13">24</span><span class="hl-15">, </span><span class="hl-5">right:</span><span class="hl-15"> </span><span class="hl-13">24</span><span class="hl-15"> }</span><span class="hl-6">}</span><span class="hl-1"> </span><span class="hl-8">// Custom positioning</span><br/><span class="hl-9">/></span><br/><br/><span class="hl-8">// Inline button</span><br/><span class="hl-9"><</span><span class="hl-10">FeedbackButton</span><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-11">inline</span><span class="hl-1">=</span><span class="hl-6">{true}</span><br/><span class="hl-1"> </span><span class="hl-11">buttonText</span><span class="hl-1">=</span><span class="hl-2">"Send Feedback"</span><br/><span class="hl-1"> </span><span class="hl-11">size</span><span class="hl-1">=</span><span class="hl-2">"medium"</span><br/><span class="hl-9">/></span>
|
|
249
249
|
</code><button type="button">Copy</button></pre>
|
|
250
250
|
|
|
251
251
|
<p><strong>Features:</strong></p>
|
|
@@ -280,7 +280,7 @@ In Angular or Vue, you may need to wrap each usage with a <code><bandit-chat-
|
|
|
280
280
|
|
|
281
281
|
<p>These components can now be used in your templates inside a <code><bandit-chat-provider></code> block.</p>
|
|
282
282
|
<p>Usage in HTML:</p>
|
|
283
|
-
<pre><code class="html"><span class="hl-9"><</span><span class="hl-
|
|
283
|
+
<pre><code class="html"><span class="hl-9"><</span><span class="hl-14">bandit-chat-provider</span><br/><span class="hl-1"> </span><span class="hl-11">packageSettings</span><span class="hl-1">=</span><span class="hl-16">'{"ollamaUrl":"https://your-ollama-url.com","defaultModel":"Bandit-Core","brandingConfigUrl":"https://cdn.burtson.ai/configs/default-config.json"}'</span><br/><span class="hl-9">></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-14">bandit-chat</span><span class="hl-9">></</span><span class="hl-14">bandit-chat</span><span class="hl-9">></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-14">bandit-management</span><span class="hl-9">></</span><span class="hl-14">bandit-management</span><span class="hl-9">></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-14">bandit-modal</span><span class="hl-9">></</span><span class="hl-14">bandit-modal</span><span class="hl-9">></span><br/><span class="hl-9"></</span><span class="hl-14">bandit-chat-provider</span><span class="hl-9">></span>
|
|
284
284
|
</code><button type="button">Copy</button></pre>
|
|
285
285
|
|
|
286
286
|
<p>Note: You only need to define the elements you intend to use. Don't mount all components on the same page. Use <code><bandit-management></code> for secure admin routes and <code><bandit-modal></code> for contextual triggers.</p>
|
|
@@ -300,7 +300,7 @@ In Angular or Vue, you may need to wrap each usage with a <code><bandit-chat-
|
|
|
300
300
|
|
|
301
301
|
<p>These components can now be used in your templates inside a <code><bandit-chat-provider></code> block.</p>
|
|
302
302
|
<p>Usage in HTML:</p>
|
|
303
|
-
<pre><code class="html"><span class="hl-9"><</span><span class="hl-
|
|
303
|
+
<pre><code class="html"><span class="hl-9"><</span><span class="hl-14">bandit-chat-provider</span><br/><span class="hl-1"> </span><span class="hl-11">packageSettings</span><span class="hl-1">=</span><span class="hl-16">'{"ollamaUrl":"https://your-ollama-url.com","defaultModel":"Bandit-Core","brandingConfigUrl":"https://cdn.burtson.ai/configs/default-config.json"}'</span><br/><span class="hl-9">></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-14">bandit-chat</span><span class="hl-9">></</span><span class="hl-14">bandit-chat</span><span class="hl-9">></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-14">bandit-management</span><span class="hl-9">></</span><span class="hl-14">bandit-management</span><span class="hl-9">></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-14">bandit-modal</span><span class="hl-9">></</span><span class="hl-14">bandit-modal</span><span class="hl-9">></span><br/><span class="hl-9"></</span><span class="hl-14">bandit-chat-provider</span><span class="hl-9">></span>
|
|
304
304
|
</code><button type="button">Copy</button></pre>
|
|
305
305
|
|
|
306
306
|
<p>Note: You only need to define the elements you intend to use. Don't mount all components on the same page. Use <code><bandit-management></code> for secure admin routes and <code><bandit-modal></code> for contextual triggers.</p>
|
|
@@ -373,7 +373,7 @@ When using Bandit components as custom elements (e.g., in Angular, Vue, or stati
|
|
|
373
373
|
</ol>
|
|
374
374
|
<p>To streamline configuration, you can host your <code>config.json</code> (and related assets like model presets or branding) via your own CDN or edge cache.</p>
|
|
375
375
|
<p>Update the <code>brandingConfigUrl</code> like this:</p>
|
|
376
|
-
<pre><code class="tsx"><span class="hl-9"><</span><span class="hl-10">ChatProvider</span><br/><span class="hl-1"> </span><span class="hl-11">packageSettings</span><span class="hl-1">=</span><span class="hl-6">{</span><span class="hl-
|
|
376
|
+
<pre><code class="tsx"><span class="hl-9"><</span><span class="hl-10">ChatProvider</span><br/><span class="hl-1"> </span><span class="hl-11">packageSettings</span><span class="hl-1">=</span><span class="hl-6">{</span><span class="hl-15">{</span><br/><span class="hl-15"> </span><span class="hl-1">...</span><span class="hl-5">chatPackageSettings</span><span class="hl-15">,</span><br/><span class="hl-15"> </span><span class="hl-5">brandingConfigUrl:</span><span class="hl-15"> </span><span class="hl-2">"https://cdn.burtson.ai/configs/default-config.json"</span><br/><span class="hl-15"> }</span><span class="hl-6">}</span><br/><span class="hl-9">></span><br/><span class="hl-1"> </span><span class="hl-9"><</span><span class="hl-10">App</span><span class="hl-1"> </span><span class="hl-9">/></span><br/><span class="hl-9"></</span><span class="hl-10">ChatProvider</span><span class="hl-9">></span>
|
|
377
377
|
</code><button type="button">Copy</button></pre>
|
|
378
378
|
|
|
379
379
|
<p>This enables remote control of Bandit appearance, available models, and more — without redeploying your frontend.</p>
|
|
@@ -468,7 +468,7 @@ Your gateway API can be built with any technology (Node.js, Python, .NET, Java,
|
|
|
468
468
|
|
|
469
469
|
<p><strong>Backend Requirements:</strong>
|
|
470
470
|
Your gateway API should accept images in the standardized format sent by the Bandit Engine and forward them appropriately to each provider. No transformation needed - the frontend handles provider-specific formatting.</p>
|
|
471
|
-
<pre><code class="javascript"><span class="hl-8">// Example: Gateway forwards images as-is using provider-specific routes</span><br/><span class="hl-5">app</span><span class="hl-1">.</span><span class="hl-0">post</span><span class="hl-1">(</span><span class="hl-2">'/api/openai/chat/completions'</span><span class="hl-1">, </span><span class="hl-6">async</span><span class="hl-1"> (</span><span class="hl-5">req</span><span class="hl-1">, </span><span class="hl-5">res</span><span class="hl-1">) </span><span class="hl-6">=></span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> { </span><span class="hl-7">messages</span><span class="hl-1">, ...</span><span class="hl-7">options</span><span class="hl-1"> } = </span><span class="hl-5">req</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">;</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> </span><span class="hl-7">response</span><span class="hl-1"> = </span><span class="hl-4">await</span><span class="hl-1"> </span><span class="hl-0">fetch</span><span class="hl-1">(</span><span class="hl-2">'https://api.openai.com/v1/chat/completions'</span><span class="hl-1">, {</span><br/><span class="hl-1"> </span><span class="hl-5">method:</span><span class="hl-1"> </span><span class="hl-2">'POST'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">headers:</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-2">'Content-Type'</span><span class="hl-5">:</span><span class="hl-1"> </span><span class="hl-2">'application/json'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">Authorization:</span><span class="hl-1"> </span><span class="hl-2">`Bearer </span><span class="hl-6">${</span><span class="hl-5">process</span><span class="hl-
|
|
471
|
+
<pre><code class="javascript"><span class="hl-8">// Example: Gateway forwards images as-is using provider-specific routes</span><br/><span class="hl-5">app</span><span class="hl-1">.</span><span class="hl-0">post</span><span class="hl-1">(</span><span class="hl-2">'/api/openai/chat/completions'</span><span class="hl-1">, </span><span class="hl-6">async</span><span class="hl-1"> (</span><span class="hl-5">req</span><span class="hl-1">, </span><span class="hl-5">res</span><span class="hl-1">) </span><span class="hl-6">=></span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> { </span><span class="hl-7">messages</span><span class="hl-1">, ...</span><span class="hl-7">options</span><span class="hl-1"> } = </span><span class="hl-5">req</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">;</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> </span><span class="hl-7">response</span><span class="hl-1"> = </span><span class="hl-4">await</span><span class="hl-1"> </span><span class="hl-0">fetch</span><span class="hl-1">(</span><span class="hl-2">'https://api.openai.com/v1/chat/completions'</span><span class="hl-1">, {</span><br/><span class="hl-1"> </span><span class="hl-5">method:</span><span class="hl-1"> </span><span class="hl-2">'POST'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">headers:</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-2">'Content-Type'</span><span class="hl-5">:</span><span class="hl-1"> </span><span class="hl-2">'application/json'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">Authorization:</span><span class="hl-1"> </span><span class="hl-2">`Bearer </span><span class="hl-6">${</span><span class="hl-5">process</span><span class="hl-15">.</span><span class="hl-5">env</span><span class="hl-15">.</span><span class="hl-7">OPENAI_API_KEY</span><span class="hl-6">}</span><span class="hl-2">`</span><br/><span class="hl-1"> },</span><br/><span class="hl-1"> </span><span class="hl-5">body:</span><span class="hl-1"> </span><span class="hl-7">JSON</span><span class="hl-1">.</span><span class="hl-0">stringify</span><span class="hl-1">({ </span><span class="hl-5">messages</span><span class="hl-1">, ...</span><span class="hl-5">options</span><span class="hl-1"> })</span><br/><span class="hl-1"> });</span><br/><br/><span class="hl-1"> </span><span class="hl-5">res</span><span class="hl-1">.</span><span class="hl-0">status</span><span class="hl-1">(</span><span class="hl-5">response</span><span class="hl-1">.</span><span class="hl-5">status</span><span class="hl-1">);</span><br/><span class="hl-1"> </span><span class="hl-5">response</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">?.</span><span class="hl-0">pipe</span><span class="hl-1">(</span><span class="hl-5">res</span><span class="hl-1">);</span><br/><span class="hl-1">});</span><br/><br/><span class="hl-5">app</span><span class="hl-1">.</span><span class="hl-0">post</span><span class="hl-1">(</span><span class="hl-2">'/api/ollama/chat'</span><span class="hl-1">, </span><span class="hl-6">async</span><span class="hl-1"> (</span><span class="hl-5">req</span><span class="hl-1">, </span><span class="hl-5">res</span><span class="hl-1">) </span><span class="hl-6">=></span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> { </span><span class="hl-7">messages</span><span class="hl-1">, ...</span><span class="hl-7">options</span><span class="hl-1"> } = </span><span class="hl-5">req</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">;</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> </span><span class="hl-7">response</span><span class="hl-1"> = </span><span class="hl-4">await</span><span class="hl-1"> </span><span class="hl-0">fetch</span><span class="hl-1">(</span><span class="hl-2">`</span><span class="hl-6">${</span><span class="hl-5">process</span><span class="hl-15">.</span><span class="hl-5">env</span><span class="hl-15">.</span><span class="hl-7">OLLAMA_URL</span><span class="hl-6">}</span><span class="hl-2">/api/chat`</span><span class="hl-1">, {</span><br/><span class="hl-1"> </span><span class="hl-5">method:</span><span class="hl-1"> </span><span class="hl-2">'POST'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">headers:</span><span class="hl-1"> { </span><span class="hl-2">'Content-Type'</span><span class="hl-5">:</span><span class="hl-1"> </span><span class="hl-2">'application/json'</span><span class="hl-1"> },</span><br/><span class="hl-1"> </span><span class="hl-5">body:</span><span class="hl-1"> </span><span class="hl-7">JSON</span><span class="hl-1">.</span><span class="hl-0">stringify</span><span class="hl-1">({ </span><span class="hl-5">messages</span><span class="hl-1">, ...</span><span class="hl-5">options</span><span class="hl-1"> })</span><br/><span class="hl-1"> });</span><br/><br/><span class="hl-1"> </span><span class="hl-5">res</span><span class="hl-1">.</span><span class="hl-0">status</span><span class="hl-1">(</span><span class="hl-5">response</span><span class="hl-1">.</span><span class="hl-5">status</span><span class="hl-1">);</span><br/><span class="hl-1"> </span><span class="hl-5">response</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">?.</span><span class="hl-0">pipe</span><span class="hl-1">(</span><span class="hl-5">res</span><span class="hl-1">);</span><br/><span class="hl-1">});</span>
|
|
472
472
|
</code><button type="button">Copy</button></pre>
|
|
473
473
|
|
|
474
474
|
<a id="md:using-the-ai-provider" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Using the AI Provider<a href="#md:using-the-ai-provider" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>All chat interactions use the unified provider system regardless of backend:</p>
|
|
@@ -597,7 +597,7 @@ Your gateway API should accept images in the standardized format sent by the Ban
|
|
|
597
597
|
</tbody>
|
|
598
598
|
</table>
|
|
599
599
|
<a id="md:jwt-based-authentication" class="tsd-anchor"></a><h3 class="tsd-anchor-link">JWT-Based Authentication<a href="#md:jwt-based-authentication" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>The feature flag system integrates with JWT tokens for dynamic subscription management:</p>
|
|
600
|
-
<pre><code class="tsx"><span class="hl-8">// Example JWT payload structure</span><br/><span class="hl-1">{</span><br/><span class="hl-1"> </span><span class="hl-2">"sub"</span><span class="hl-1">: </span><span class="hl-2">"user123"</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-2">"subscriptionType"</span><span class="hl-1">: </span><span class="hl-2">"pro"</span><span class="hl-1">, </span><span class="hl-8">// Controls tier access</span><br/><span class="hl-1"> </span><span class="hl-2">"isSubscribed"</span><span class="hl-1">: </span><span class="hl-6">true</span><span class="hl-1">, </span><span class="hl-8">// Overall subscription status</span><br/><span class="hl-1"> </span><span class="hl-2">"roles"</span><span class="hl-1">: [</span><span class="hl-2">"user"</span><span class="hl-1">, </span><span class="hl-2">"admin"</span><span class="hl-1">], </span><span class="hl-8">// User roles for admin features</span><br/><span class="hl-1"> </span><span class="hl-2">"exp"</span><span class="hl-1">: </span><span class="hl-
|
|
600
|
+
<pre><code class="tsx"><span class="hl-8">// Example JWT payload structure</span><br/><span class="hl-1">{</span><br/><span class="hl-1"> </span><span class="hl-2">"sub"</span><span class="hl-1">: </span><span class="hl-2">"user123"</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-2">"subscriptionType"</span><span class="hl-1">: </span><span class="hl-2">"pro"</span><span class="hl-1">, </span><span class="hl-8">// Controls tier access</span><br/><span class="hl-1"> </span><span class="hl-2">"isSubscribed"</span><span class="hl-1">: </span><span class="hl-6">true</span><span class="hl-1">, </span><span class="hl-8">// Overall subscription status</span><br/><span class="hl-1"> </span><span class="hl-2">"roles"</span><span class="hl-1">: [</span><span class="hl-2">"user"</span><span class="hl-1">, </span><span class="hl-2">"admin"</span><span class="hl-1">], </span><span class="hl-8">// User roles for admin features</span><br/><span class="hl-1"> </span><span class="hl-2">"exp"</span><span class="hl-1">: </span><span class="hl-13">1640995200</span><br/><span class="hl-1">}</span>
|
|
601
601
|
</code><button type="button">Copy</button></pre>
|
|
602
602
|
|
|
603
603
|
<a id="md:using-feature-flags-in-components" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Using Feature Flags in Components<a href="#md:using-feature-flags-in-components" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>Access feature flags throughout your application:</p>
|
|
@@ -619,7 +619,7 @@ Your gateway API should accept images in the standardized format sent by the Ban
|
|
|
619
619
|
</code><button type="button">Copy</button></pre>
|
|
620
620
|
|
|
621
621
|
<a id="md:backend-integration" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Backend Integration<a href="#md:backend-integration" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>Your gateway API should validate subscription tiers and return appropriate feature access:</p>
|
|
622
|
-
<pre><code class="javascript"><span class="hl-8">// Example: Gateway API subscription validation</span><br/><span class="hl-5">app</span><span class="hl-1">.</span><span class="hl-0">post</span><span class="hl-1">(</span><span class="hl-2">'/api/openai/chat/completions'</span><span class="hl-1">, </span><span class="hl-5">authenticateJWT</span><span class="hl-1">, </span><span class="hl-6">async</span><span class="hl-1"> (</span><span class="hl-5">req</span><span class="hl-1">, </span><span class="hl-5">res</span><span class="hl-1">) </span><span class="hl-6">=></span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> { </span><span class="hl-7">subscriptionType</span><span class="hl-1">, </span><span class="hl-7">isSubscribed</span><span class="hl-1"> } = </span><span class="hl-5">req</span><span class="hl-1">.</span><span class="hl-5">user</span><span class="hl-1">;</span><br/><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-8">// Validate tier access for requested features</span><br/><span class="hl-1"> </span><span class="hl-4">if</span><span class="hl-1"> (</span><span class="hl-5">req</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">.</span><span class="hl-5">tts</span><span class="hl-1"> && !</span><span class="hl-0">hasFeature</span><span class="hl-1">(</span><span class="hl-5">subscriptionType</span><span class="hl-1">, </span><span class="hl-2">'tts'</span><span class="hl-1">)) {</span><br/><span class="hl-1"> </span><span class="hl-4">return</span><span class="hl-1"> </span><span class="hl-5">res</span><span class="hl-1">.</span><span class="hl-0">status</span><span class="hl-1">(</span><span class="hl-
|
|
622
|
+
<pre><code class="javascript"><span class="hl-8">// Example: Gateway API subscription validation</span><br/><span class="hl-5">app</span><span class="hl-1">.</span><span class="hl-0">post</span><span class="hl-1">(</span><span class="hl-2">'/api/openai/chat/completions'</span><span class="hl-1">, </span><span class="hl-5">authenticateJWT</span><span class="hl-1">, </span><span class="hl-6">async</span><span class="hl-1"> (</span><span class="hl-5">req</span><span class="hl-1">, </span><span class="hl-5">res</span><span class="hl-1">) </span><span class="hl-6">=></span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> { </span><span class="hl-7">subscriptionType</span><span class="hl-1">, </span><span class="hl-7">isSubscribed</span><span class="hl-1"> } = </span><span class="hl-5">req</span><span class="hl-1">.</span><span class="hl-5">user</span><span class="hl-1">;</span><br/><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-8">// Validate tier access for requested features</span><br/><span class="hl-1"> </span><span class="hl-4">if</span><span class="hl-1"> (</span><span class="hl-5">req</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">.</span><span class="hl-5">tts</span><span class="hl-1"> && !</span><span class="hl-0">hasFeature</span><span class="hl-1">(</span><span class="hl-5">subscriptionType</span><span class="hl-1">, </span><span class="hl-2">'tts'</span><span class="hl-1">)) {</span><br/><span class="hl-1"> </span><span class="hl-4">return</span><span class="hl-1"> </span><span class="hl-5">res</span><span class="hl-1">.</span><span class="hl-0">status</span><span class="hl-1">(</span><span class="hl-13">403</span><span class="hl-1">).</span><span class="hl-0">json</span><span class="hl-1">({ </span><br/><span class="hl-1"> </span><span class="hl-5">error:</span><span class="hl-1"> </span><span class="hl-2">'TTS requires Premium subscription or higher'</span><span class="hl-1"> </span><br/><span class="hl-1"> });</span><br/><span class="hl-1"> }</span><br/><span class="hl-1"> </span><br/><span class="hl-1"> </span><span class="hl-8">// Proceed with AI request</span><br/><span class="hl-1"> </span><span class="hl-6">const</span><span class="hl-1"> </span><span class="hl-7">response</span><span class="hl-1"> = </span><span class="hl-4">await</span><span class="hl-1"> </span><span class="hl-0">fetch</span><span class="hl-1">(</span><span class="hl-2">'https://api.openai.com/v1/chat/completions'</span><span class="hl-1">, {</span><br/><span class="hl-1"> </span><span class="hl-5">method:</span><span class="hl-1"> </span><span class="hl-2">'POST'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">headers:</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-2">'Content-Type'</span><span class="hl-5">:</span><span class="hl-1"> </span><span class="hl-2">'application/json'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-5">Authorization:</span><span class="hl-1"> </span><span class="hl-2">`Bearer </span><span class="hl-6">${</span><span class="hl-5">process</span><span class="hl-15">.</span><span class="hl-5">env</span><span class="hl-15">.</span><span class="hl-7">OPENAI_API_KEY</span><span class="hl-6">}</span><span class="hl-2">`</span><br/><span class="hl-1"> },</span><br/><span class="hl-1"> </span><span class="hl-5">body:</span><span class="hl-1"> </span><span class="hl-7">JSON</span><span class="hl-1">.</span><span class="hl-0">stringify</span><span class="hl-1">(</span><span class="hl-5">req</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">)</span><br/><span class="hl-1"> });</span><br/><br/><span class="hl-1"> </span><span class="hl-5">res</span><span class="hl-1">.</span><span class="hl-0">status</span><span class="hl-1">(</span><span class="hl-5">response</span><span class="hl-1">.</span><span class="hl-5">status</span><span class="hl-1">);</span><br/><span class="hl-1"> </span><span class="hl-5">response</span><span class="hl-1">.</span><span class="hl-5">body</span><span class="hl-1">?.</span><span class="hl-0">pipe</span><span class="hl-1">(</span><span class="hl-5">res</span><span class="hl-1">);</span><br/><span class="hl-1">});</span>
|
|
623
623
|
</code><button type="button">Copy</button></pre>
|
|
624
624
|
|
|
625
625
|
<p>This feature flag system enables you to build sophisticated subscription-based AI products with fine-grained access control and seamless upgrade flows.</p>
|