@neurobot/sdk-react 1.0.0
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/INTEGRATION.md +140 -0
- package/LICENSE +21 -0
- package/MOCK_MODE.md +245 -0
- package/README.md +114 -0
- package/dist/components/ChatWindow.d.ts +25 -0
- package/dist/components/ChatWindow.d.ts.map +1 -0
- package/dist/components/ChatWindow.js +14 -0
- package/dist/components/ChatWindow.js.map +1 -0
- package/dist/components/FloatingButton.d.ts +9 -0
- package/dist/components/FloatingButton.d.ts.map +1 -0
- package/dist/components/FloatingButton.js +8 -0
- package/dist/components/FloatingButton.js.map +1 -0
- package/dist/components/InputForm.d.ts +11 -0
- package/dist/components/InputForm.d.ts.map +1 -0
- package/dist/components/InputForm.js +9 -0
- package/dist/components/InputForm.js.map +1 -0
- package/dist/components/MessageList.d.ts +11 -0
- package/dist/components/MessageList.d.ts.map +1 -0
- package/dist/components/MessageList.js +12 -0
- package/dist/components/MessageList.js.map +1 -0
- package/dist/components/NeuroBot.d.ts +4 -0
- package/dist/components/NeuroBot.d.ts.map +1 -0
- package/dist/components/NeuroBot.js +110 -0
- package/dist/components/NeuroBot.js.map +1 -0
- package/dist/context/NeuroBotContext.d.ts +18 -0
- package/dist/context/NeuroBotContext.d.ts.map +1 -0
- package/dist/context/NeuroBotContext.js +20 -0
- package/dist/context/NeuroBotContext.js.map +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.esm.js +1776 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/index.js +1783 -0
- package/dist/index.js.map +1 -0
- package/dist/index.umd.js +1787 -0
- package/dist/index.umd.js.map +1 -0
- package/dist/types/index.d.ts +25 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/types/index.js +2 -0
- package/dist/types/index.js.map +1 -0
- package/dist/utils/api.d.ts +25 -0
- package/dist/utils/api.d.ts.map +1 -0
- package/dist/utils/api.js +49 -0
- package/dist/utils/api.js.map +1 -0
- package/dist/utils/auth.d.ts +20 -0
- package/dist/utils/auth.d.ts.map +1 -0
- package/dist/utils/auth.js +30 -0
- package/dist/utils/auth.js.map +1 -0
- package/dist/utils/mock.d.ts +20 -0
- package/dist/utils/mock.d.ts.map +1 -0
- package/dist/utils/mock.js +67 -0
- package/dist/utils/mock.js.map +1 -0
- package/package.json +64 -0
package/INTEGRATION.md
ADDED
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
# Integration Guide
|
|
2
|
+
|
|
3
|
+
## React with Provider
|
|
4
|
+
|
|
5
|
+
```jsx
|
|
6
|
+
import { NeuroBotProvider, NeuroBot } from '@neurobot/sdk-react';
|
|
7
|
+
|
|
8
|
+
export default function App() {
|
|
9
|
+
return (
|
|
10
|
+
<NeuroBotProvider
|
|
11
|
+
publicKey="pk_live_your_public_key"
|
|
12
|
+
>
|
|
13
|
+
<YourApp />
|
|
14
|
+
<NeuroBot pipelineId="your-pipeline-id" />
|
|
15
|
+
</NeuroBotProvider>
|
|
16
|
+
);
|
|
17
|
+
}
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
### Provider Props
|
|
21
|
+
|
|
22
|
+
| Prop | Type | Required | Description |
|
|
23
|
+
|------|------|----------|-------------|
|
|
24
|
+
| `publicKey` | string | ✅ | Public API key from NeuroBot Studio |
|
|
25
|
+
| `timeout` | number | - | Request timeout in ms. Default: 30000 |
|
|
26
|
+
| `children` | ReactNode | ✅ | Your app components |
|
|
27
|
+
|
|
28
|
+
## Next.js (SSR Safe)
|
|
29
|
+
|
|
30
|
+
```jsx
|
|
31
|
+
import dynamic from 'next/dynamic';
|
|
32
|
+
import { NeuroBotProvider } from '@neurobot/sdk-react';
|
|
33
|
+
|
|
34
|
+
const NeuroBot = dynamic(() => import('@neurobot/sdk-react').then(m => m.NeuroBot), {
|
|
35
|
+
ssr: false,
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
export default function Home() {
|
|
39
|
+
return (
|
|
40
|
+
<NeuroBotProvider
|
|
41
|
+
publicKey="pk_live_your_public_key"
|
|
42
|
+
>
|
|
43
|
+
<NeuroBot pipelineId="your-pipeline-id" />
|
|
44
|
+
</NeuroBotProvider>
|
|
45
|
+
);
|
|
46
|
+
}
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
## Full Customization Example
|
|
50
|
+
|
|
51
|
+
```jsx
|
|
52
|
+
import { NeuroBotProvider, NeuroBot } from '@neurobot/sdk-react';
|
|
53
|
+
|
|
54
|
+
export default function App() {
|
|
55
|
+
return (
|
|
56
|
+
<NeuroBotProvider
|
|
57
|
+
publicKey="pk_live_your_public_key"
|
|
58
|
+
timeout={30000}
|
|
59
|
+
>
|
|
60
|
+
<NeuroBot
|
|
61
|
+
pipelineId="your-pipeline-id"
|
|
62
|
+
title="Support Assistant"
|
|
63
|
+
position="bottom-right"
|
|
64
|
+
config={{
|
|
65
|
+
primaryColor: '#3b82f6',
|
|
66
|
+
accentColor: '#1e40af',
|
|
67
|
+
backgroundColor: '#ffffff',
|
|
68
|
+
textColor: '#1f2937',
|
|
69
|
+
borderRadius: '12px',
|
|
70
|
+
fontSize: '14px',
|
|
71
|
+
}}
|
|
72
|
+
onMessageSent={(message) => {
|
|
73
|
+
console.log('User sent:', message);
|
|
74
|
+
// Track analytics
|
|
75
|
+
}}
|
|
76
|
+
onMessageReceived={(message) => {
|
|
77
|
+
console.log('Bot responded:', message);
|
|
78
|
+
// Update UI or trigger actions
|
|
79
|
+
}}
|
|
80
|
+
/>
|
|
81
|
+
</NeuroBotProvider>
|
|
82
|
+
);
|
|
83
|
+
}
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
## How It Works
|
|
87
|
+
|
|
88
|
+
**Simple flow:**
|
|
89
|
+
```
|
|
90
|
+
Consumer App
|
|
91
|
+
↓ (publicKey + pipelineId + message)
|
|
92
|
+
NeuroBot API (hardcoded in SDK)
|
|
93
|
+
↓ (validates publicKey + secretKey)
|
|
94
|
+
├─ Processes conversation
|
|
95
|
+
├─ Calls LLM models
|
|
96
|
+
├─ Applies pipeline customizations
|
|
97
|
+
└─ Returns AI-generated response
|
|
98
|
+
↓
|
|
99
|
+
Consumer App (receives response)
|
|
100
|
+
```
|
|
101
|
+
|
|
102
|
+
**What consumer provides:**
|
|
103
|
+
- `publicKey`: Public API key (safe to expose)
|
|
104
|
+
- `pipelineId`: Pipeline identifier
|
|
105
|
+
- `message`: User message
|
|
106
|
+
|
|
107
|
+
**What SDK handles:**
|
|
108
|
+
- API URL is hardcoded (no need to pass)
|
|
109
|
+
- Sends request to NeuroBot backend
|
|
110
|
+
- Handles authentication headers
|
|
111
|
+
|
|
112
|
+
**What NeuroBot backend does:**
|
|
113
|
+
- Validates public key
|
|
114
|
+
- Uses secret key for validation (never exposed to client)
|
|
115
|
+
- Processes conversation using LLM models
|
|
116
|
+
- Applies pipeline customizations
|
|
117
|
+
- Returns AI-generated response
|
|
118
|
+
|
|
119
|
+
**Security:**
|
|
120
|
+
- ✅ Only public key exposed to frontend
|
|
121
|
+
- ✅ Secret key stays on backend
|
|
122
|
+
- ✅ API URL hardcoded in SDK
|
|
123
|
+
- ✅ All conversation processing on backend
|
|
124
|
+
- ✅ LLM calls handled securely
|
|
125
|
+
|
|
126
|
+
## TypeScript Support
|
|
127
|
+
|
|
128
|
+
```typescript
|
|
129
|
+
import { NeuroBot, NeuroBotProps, ChatConfig } from '@neurobot/sdk-react';
|
|
130
|
+
|
|
131
|
+
const config: ChatConfig = {
|
|
132
|
+
primaryColor: '#3b82f6',
|
|
133
|
+
};
|
|
134
|
+
|
|
135
|
+
const props: NeuroBotProps = {
|
|
136
|
+
pipelineId: 'my-pipeline',
|
|
137
|
+
title: 'Support',
|
|
138
|
+
config,
|
|
139
|
+
};
|
|
140
|
+
```
|
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2024 NeuroBot Team
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/MOCK_MODE.md
ADDED
|
@@ -0,0 +1,245 @@
|
|
|
1
|
+
# Mock Mode - Testing Without Backend
|
|
2
|
+
|
|
3
|
+
Mock mode allows you to test the SDK without a real backend API. It provides realistic dummy responses with simulated network delays.
|
|
4
|
+
|
|
5
|
+
## Quick Start
|
|
6
|
+
|
|
7
|
+
### Enable Mock Mode
|
|
8
|
+
|
|
9
|
+
```jsx
|
|
10
|
+
import { NeuroBotProvider, NeuroBot } from '@neurobot/sdk-react';
|
|
11
|
+
|
|
12
|
+
export default function App() {
|
|
13
|
+
return (
|
|
14
|
+
<NeuroBotProvider publicKey="pk_live_test">
|
|
15
|
+
<NeuroBot
|
|
16
|
+
pipelineId="test-pipeline"
|
|
17
|
+
useMock={true} // Enable mock mode
|
|
18
|
+
/>
|
|
19
|
+
</NeuroBotProvider>
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
## Features
|
|
25
|
+
|
|
26
|
+
### Contextual Responses
|
|
27
|
+
|
|
28
|
+
Mock mode provides intelligent responses based on keywords:
|
|
29
|
+
|
|
30
|
+
```
|
|
31
|
+
User: "hello"
|
|
32
|
+
Bot: "Hello! How can I assist you today?"
|
|
33
|
+
|
|
34
|
+
User: "what's your return policy?"
|
|
35
|
+
Bot: "We offer 30-day returns on most items with original receipt..."
|
|
36
|
+
|
|
37
|
+
User: "how do I reset my password?"
|
|
38
|
+
Bot: "You can reset your password by clicking 'Forgot Password' on the login page..."
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
### Realistic Delays
|
|
42
|
+
|
|
43
|
+
Responses include simulated network delays (500-1500ms) for realistic testing:
|
|
44
|
+
|
|
45
|
+
```
|
|
46
|
+
User sends message
|
|
47
|
+
↓ (simulated delay)
|
|
48
|
+
Bot responds
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
### Fallback Responses
|
|
52
|
+
|
|
53
|
+
For unrecognized questions, mock mode returns random helpful responses:
|
|
54
|
+
|
|
55
|
+
```
|
|
56
|
+
User: "Tell me about your company"
|
|
57
|
+
Bot: "That's a great question! I'd be happy to help you with that."
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
## Supported Keywords
|
|
61
|
+
|
|
62
|
+
Mock mode recognizes these keywords and provides contextual responses:
|
|
63
|
+
|
|
64
|
+
| Keyword | Response Category |
|
|
65
|
+
|---------|-------------------|
|
|
66
|
+
| hello, hi | Greeting |
|
|
67
|
+
| how are you | Greeting |
|
|
68
|
+
| thanks, thank you | Acknowledgment |
|
|
69
|
+
| bye, goodbye | Farewell |
|
|
70
|
+
| help | Assistance |
|
|
71
|
+
| what can you do | Capabilities |
|
|
72
|
+
| who are you | Identity |
|
|
73
|
+
| return policy | Returns |
|
|
74
|
+
| shipping | Shipping info |
|
|
75
|
+
| refund | Refund info |
|
|
76
|
+
| contact | Contact info |
|
|
77
|
+
| hours | Business hours |
|
|
78
|
+
| price | Pricing |
|
|
79
|
+
| discount | Promotions |
|
|
80
|
+
| warranty | Warranty info |
|
|
81
|
+
|
|
82
|
+
## Usage Examples
|
|
83
|
+
|
|
84
|
+
### Development Testing
|
|
85
|
+
|
|
86
|
+
```jsx
|
|
87
|
+
// During development, use mock mode
|
|
88
|
+
<NeuroBot
|
|
89
|
+
pipelineId="dev-pipeline"
|
|
90
|
+
useMock={true}
|
|
91
|
+
onMessageSent={(msg) => console.log('Sent:', msg)}
|
|
92
|
+
onMessageReceived={(msg) => console.log('Received:', msg)}
|
|
93
|
+
/>
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
### Conditional Mock Mode
|
|
97
|
+
|
|
98
|
+
```jsx
|
|
99
|
+
const isDevelopment = process.env.NODE_ENV === 'development';
|
|
100
|
+
|
|
101
|
+
<NeuroBot
|
|
102
|
+
pipelineId="my-pipeline"
|
|
103
|
+
useMock={isDevelopment} // Only mock in development
|
|
104
|
+
/>
|
|
105
|
+
```
|
|
106
|
+
|
|
107
|
+
### Environment-Based
|
|
108
|
+
|
|
109
|
+
```jsx
|
|
110
|
+
const useMock = process.env.REACT_APP_USE_MOCK === 'true';
|
|
111
|
+
|
|
112
|
+
<NeuroBot
|
|
113
|
+
pipelineId="my-pipeline"
|
|
114
|
+
useMock={useMock}
|
|
115
|
+
/>
|
|
116
|
+
```
|
|
117
|
+
|
|
118
|
+
**.env.development:**
|
|
119
|
+
```
|
|
120
|
+
REACT_APP_USE_MOCK=true
|
|
121
|
+
```
|
|
122
|
+
|
|
123
|
+
**.env.production:**
|
|
124
|
+
```
|
|
125
|
+
REACT_APP_USE_MOCK=false
|
|
126
|
+
```
|
|
127
|
+
|
|
128
|
+
## Mock Response Examples
|
|
129
|
+
|
|
130
|
+
### Greeting
|
|
131
|
+
```
|
|
132
|
+
User: "Hi there"
|
|
133
|
+
Bot: "Hi there! What can I help you with?"
|
|
134
|
+
```
|
|
135
|
+
|
|
136
|
+
### Return Policy
|
|
137
|
+
```
|
|
138
|
+
User: "What's your return policy?"
|
|
139
|
+
Bot: "We offer 30-day returns on most items with original receipt. Items must be in original condition. You can return items in-store or by mail."
|
|
140
|
+
```
|
|
141
|
+
|
|
142
|
+
### Shipping
|
|
143
|
+
```
|
|
144
|
+
User: "How long does shipping take?"
|
|
145
|
+
Bot: "We offer free shipping on orders over $50. Standard shipping takes 5-7 business days. Express shipping is available for an additional fee."
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
### Refunds
|
|
149
|
+
```
|
|
150
|
+
User: "When will I get my refund?"
|
|
151
|
+
Bot: "Refunds are processed within 5-10 business days after we receive your return. You'll receive a confirmation email with tracking information."
|
|
152
|
+
```
|
|
153
|
+
|
|
154
|
+
### Contact
|
|
155
|
+
```
|
|
156
|
+
User: "How can I contact support?"
|
|
157
|
+
Bot: "You can reach us via email at support@example.com or call 1-800-EXAMPLE. Our team is available Monday-Friday, 9am-5pm EST."
|
|
158
|
+
```
|
|
159
|
+
|
|
160
|
+
## Switching to Real Backend
|
|
161
|
+
|
|
162
|
+
When you're ready to use the real backend, simply disable mock mode:
|
|
163
|
+
|
|
164
|
+
```jsx
|
|
165
|
+
// Before (development)
|
|
166
|
+
<NeuroBot pipelineId="my-pipeline" useMock={true} />
|
|
167
|
+
|
|
168
|
+
// After (production)
|
|
169
|
+
<NeuroBot pipelineId="my-pipeline" useMock={false} />
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
Or remove the prop entirely (defaults to false):
|
|
173
|
+
|
|
174
|
+
```jsx
|
|
175
|
+
<NeuroBot pipelineId="my-pipeline" />
|
|
176
|
+
```
|
|
177
|
+
|
|
178
|
+
## Adding Custom Mock Responses
|
|
179
|
+
|
|
180
|
+
To add more contextual responses, edit `src/utils/mock.ts`:
|
|
181
|
+
|
|
182
|
+
```typescript
|
|
183
|
+
const contextualResponses: { [key: string]: string } = {
|
|
184
|
+
'hello': 'Hello! How can I assist you today?',
|
|
185
|
+
'your-keyword': 'Your custom response here',
|
|
186
|
+
// Add more keywords and responses
|
|
187
|
+
};
|
|
188
|
+
```
|
|
189
|
+
|
|
190
|
+
## Testing Checklist
|
|
191
|
+
|
|
192
|
+
- [ ] Test basic message sending
|
|
193
|
+
- [ ] Test greeting responses
|
|
194
|
+
- [ ] Test contextual responses (return policy, shipping, etc.)
|
|
195
|
+
- [ ] Test fallback responses (random responses)
|
|
196
|
+
- [ ] Test callbacks (onMessageSent, onMessageReceived)
|
|
197
|
+
- [ ] Test styling and configuration
|
|
198
|
+
- [ ] Test minimize/maximize functionality
|
|
199
|
+
- [ ] Test error handling
|
|
200
|
+
|
|
201
|
+
## Disabling Mock Mode for Production
|
|
202
|
+
|
|
203
|
+
**Important:** Always disable mock mode in production:
|
|
204
|
+
|
|
205
|
+
```jsx
|
|
206
|
+
// ❌ Don't do this in production
|
|
207
|
+
<NeuroBot pipelineId="my-pipeline" useMock={true} />
|
|
208
|
+
|
|
209
|
+
// ✅ Do this in production
|
|
210
|
+
<NeuroBot pipelineId="my-pipeline" useMock={false} />
|
|
211
|
+
// or simply omit useMock prop
|
|
212
|
+
<NeuroBot pipelineId="my-pipeline" />
|
|
213
|
+
```
|
|
214
|
+
|
|
215
|
+
## Performance
|
|
216
|
+
|
|
217
|
+
Mock responses are instant (with simulated delay):
|
|
218
|
+
- Response time: 500-1500ms (simulated)
|
|
219
|
+
- No network overhead
|
|
220
|
+
- No backend required
|
|
221
|
+
- Perfect for testing and demos
|
|
222
|
+
|
|
223
|
+
## Limitations
|
|
224
|
+
|
|
225
|
+
Mock mode does NOT:
|
|
226
|
+
- ❌ Validate public keys
|
|
227
|
+
- ❌ Validate signatures
|
|
228
|
+
- ❌ Call real LLM models
|
|
229
|
+
- ❌ Process real pipelines
|
|
230
|
+
- ❌ Store conversations
|
|
231
|
+
- ❌ Integrate with backend services
|
|
232
|
+
|
|
233
|
+
Mock mode is for **testing and development only**.
|
|
234
|
+
|
|
235
|
+
## Summary
|
|
236
|
+
|
|
237
|
+
Mock mode enables:
|
|
238
|
+
✅ Testing without backend
|
|
239
|
+
✅ Development without API setup
|
|
240
|
+
✅ Demo purposes
|
|
241
|
+
✅ Realistic UI/UX testing
|
|
242
|
+
✅ Callback testing
|
|
243
|
+
✅ Error handling testing
|
|
244
|
+
|
|
245
|
+
Use mock mode during development, disable for production.
|
package/README.md
ADDED
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
# NeuroBot SDK React
|
|
2
|
+
|
|
3
|
+
Lightweight embeddable React chatbot widget for your applications.
|
|
4
|
+
|
|
5
|
+
## Quick Start
|
|
6
|
+
|
|
7
|
+
### Installation
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install @neurobot/sdk-react
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
### Setup with Provider
|
|
14
|
+
|
|
15
|
+
```jsx
|
|
16
|
+
import { NeuroBotProvider, NeuroBot } from '@neurobot/sdk-react';
|
|
17
|
+
|
|
18
|
+
export default function App() {
|
|
19
|
+
return (
|
|
20
|
+
<NeuroBotProvider
|
|
21
|
+
publicKey="pk_live_your_public_key" // Only required prop
|
|
22
|
+
>
|
|
23
|
+
<YourApp />
|
|
24
|
+
<NeuroBot pipelineId="your-pipeline-id" />
|
|
25
|
+
</NeuroBotProvider>
|
|
26
|
+
);
|
|
27
|
+
}
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
### How It Works
|
|
31
|
+
|
|
32
|
+
**Client-side (Safe to expose):**
|
|
33
|
+
- `publicKey`: Public API key from NeuroBot Studio
|
|
34
|
+
- `pipelineId`: Pipeline identifier
|
|
35
|
+
- API URL is hardcoded in SDK
|
|
36
|
+
|
|
37
|
+
**Server-side (NeuroBot Backend - Keep secret):**
|
|
38
|
+
- `secretKey`: Never expose to frontend
|
|
39
|
+
- Validates requests using secret key
|
|
40
|
+
- Processes conversations using LLM models
|
|
41
|
+
- Applies pipeline customizations
|
|
42
|
+
- Returns AI-generated responses
|
|
43
|
+
|
|
44
|
+
### Get Your Credentials
|
|
45
|
+
|
|
46
|
+
1. **Pipeline ID**: Created in NeuroBot Studio when you create a pipeline
|
|
47
|
+
2. **Public Key**: Generated in Pipeline Settings → API Keys (safe for frontend)
|
|
48
|
+
3. **Secret Key**: Generated in Pipeline Settings → API Keys (backend only, never in frontend)
|
|
49
|
+
|
|
50
|
+
## Props
|
|
51
|
+
|
|
52
|
+
| Prop | Type | Required | Default | Description |
|
|
53
|
+
|------|------|----------|---------|-------------|
|
|
54
|
+
| `pipelineId` | string | ✅ | - | Your NeuroBot pipeline ID |
|
|
55
|
+
| `chatbotId` | string | - | - | Optional chatbot identifier |
|
|
56
|
+
| `title` | string | - | `'NeuroBot Assistant'` | Chat window title |
|
|
57
|
+
| `position` | string | - | `'bottom-right'` | Position: `'bottom-right'`, `'bottom-left'`, `'top-right'`, `'top-left'` |
|
|
58
|
+
| `config` | object | - | - | Styling configuration |
|
|
59
|
+
| `onMessageSent` | function | - | - | Callback when user sends message |
|
|
60
|
+
| `onMessageReceived` | function | - | - | Callback when bot responds |
|
|
61
|
+
| `useMock` | boolean | - | `false` | Use mock responses for testing without backend |
|
|
62
|
+
|
|
63
|
+
### Config Options
|
|
64
|
+
|
|
65
|
+
```jsx
|
|
66
|
+
config={{
|
|
67
|
+
primaryColor: '#3b82f6', // Main color
|
|
68
|
+
accentColor: '#1e40af', // Accent color
|
|
69
|
+
backgroundColor: '#ffffff', // Chat background
|
|
70
|
+
textColor: '#1f2937', // Text color
|
|
71
|
+
borderRadius: '12px', // Border radius
|
|
72
|
+
fontSize: '14px' // Font size
|
|
73
|
+
}}
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
## Backend Integration
|
|
77
|
+
|
|
78
|
+
Implement `/api/chat` endpoint:
|
|
79
|
+
|
|
80
|
+
```
|
|
81
|
+
POST /api/chat
|
|
82
|
+
{
|
|
83
|
+
"pipelineId": "string",
|
|
84
|
+
"message": "string",
|
|
85
|
+
"context": { "pageUrl": "string", "pageTitle": "string" }
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
Response:
|
|
89
|
+
{ "response": "string" }
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
## Features
|
|
93
|
+
|
|
94
|
+
- ✨ Lightweight (~15KB gzipped)
|
|
95
|
+
- 🎨 Fully customizable
|
|
96
|
+
- 📱 Responsive design
|
|
97
|
+
- ♿ Accessible
|
|
98
|
+
- 📦 TypeScript support
|
|
99
|
+
- 🌙 Dark mode compatible
|
|
100
|
+
|
|
101
|
+
## Requirements
|
|
102
|
+
|
|
103
|
+
- **React** ^18.0.0
|
|
104
|
+
- **React-DOM** ^18.0.0
|
|
105
|
+
- **Tailwind CSS** - The SDK uses Tailwind CSS classes. Make sure your project has Tailwind CSS configured.
|
|
106
|
+
|
|
107
|
+
## Documentation
|
|
108
|
+
|
|
109
|
+
- [Integration Guide](./INTEGRATION.md) - Framework-specific examples
|
|
110
|
+
- [Mock Mode Guide](./MOCK_MODE.md) - Testing without a backend
|
|
111
|
+
|
|
112
|
+
## License
|
|
113
|
+
|
|
114
|
+
MIT
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import React, { FormEvent } from 'react';
|
|
2
|
+
import { Message } from '../types';
|
|
3
|
+
interface ChatWindowProps {
|
|
4
|
+
title: string;
|
|
5
|
+
messages: Message[];
|
|
6
|
+
inputValue: string;
|
|
7
|
+
isLoading: boolean;
|
|
8
|
+
isMinimized: boolean;
|
|
9
|
+
messagesEndRef: React.RefObject<HTMLDivElement | null>;
|
|
10
|
+
config: {
|
|
11
|
+
primaryColor: string;
|
|
12
|
+
accentColor: string;
|
|
13
|
+
backgroundColor: string;
|
|
14
|
+
textColor: string;
|
|
15
|
+
borderRadius: string;
|
|
16
|
+
fontSize: string;
|
|
17
|
+
};
|
|
18
|
+
onInputChange: (value: string) => void;
|
|
19
|
+
onSubmit: (e: FormEvent<HTMLFormElement>) => void;
|
|
20
|
+
onMinimize: () => void;
|
|
21
|
+
onClose: () => void;
|
|
22
|
+
}
|
|
23
|
+
export declare const ChatWindow: React.FC<ChatWindowProps>;
|
|
24
|
+
export {};
|
|
25
|
+
//# sourceMappingURL=ChatWindow.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatWindow.d.ts","sourceRoot":"","sources":["../../components/ChatWindow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAInC,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,EAAE,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACvD,MAAM,EAAE;QACN,YAAY,EAAE,MAAM,CAAC;QACrB,WAAW,EAAE,MAAM,CAAC;QACpB,eAAe,EAAE,MAAM,CAAC;QACxB,SAAS,EAAE,MAAM,CAAC;QAClB,YAAY,EAAE,MAAM,CAAC;QACrB,QAAQ,EAAE,MAAM,CAAC;KAClB,CAAC;IACF,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,QAAQ,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IAClD,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAuEhD,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { X, Minimize2, Maximize2 } from 'lucide-react';
|
|
3
|
+
import { MessageList } from './MessageList';
|
|
4
|
+
import { InputForm } from './InputForm';
|
|
5
|
+
export const ChatWindow = ({ title, messages, inputValue, isLoading, isMinimized, messagesEndRef, config, onInputChange, onSubmit, onMinimize, onClose, }) => {
|
|
6
|
+
return (_jsxs("div", { className: "w-96 flex flex-col overflow-hidden rounded-2xl border border-neutral-200/50 dark:border-neutral-700/50 shadow-2xl transition-all duration-300", style: {
|
|
7
|
+
height: isMinimized ? '56px' : '600px',
|
|
8
|
+
backgroundColor: config.backgroundColor,
|
|
9
|
+
fontSize: config.fontSize,
|
|
10
|
+
}, children: [_jsxs("div", { className: "text-white px-6 py-4 flex items-center justify-between flex-shrink-0 shadow-lg", style: {
|
|
11
|
+
background: `linear-gradient(135deg, ${config.primaryColor} 0%, ${config.accentColor} 100%)`,
|
|
12
|
+
}, children: [_jsxs("div", { className: "flex flex-col", children: [_jsx("h3", { className: "font-bold text-base leading-tight", children: title }), _jsx("p", { className: "text-xs text-white/70 mt-0.5", children: "Always here to help" })] }), _jsxs("div", { className: "flex gap-1", children: [_jsx("button", { onClick: onMinimize, className: "p-2 hover:bg-white/20 rounded-lg transition-all duration-200 hover:scale-110", "aria-label": "Minimize chat", children: isMinimized ? _jsx(Maximize2, { size: 18 }) : _jsx(Minimize2, { size: 18 }) }), _jsx("button", { onClick: onClose, className: "p-2 hover:bg-white/20 rounded-lg transition-all duration-200 hover:scale-110", "aria-label": "Close chat", children: _jsx(X, { size: 18 }) })] })] }), !isMinimized && (_jsxs(_Fragment, { children: [_jsx(MessageList, { messages: messages, messagesEndRef: messagesEndRef, textColor: config.textColor, primaryColor: config.primaryColor }), _jsx(InputForm, { inputValue: inputValue, isLoading: isLoading, onInputChange: onInputChange, onSubmit: onSubmit, primaryColor: config.primaryColor })] }))] }));
|
|
13
|
+
};
|
|
14
|
+
//# sourceMappingURL=ChatWindow.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatWindow.js","sourceRoot":"","sources":["../../components/ChatWindow.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEvD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAuBxC,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EACpD,KAAK,EACL,QAAQ,EACR,UAAU,EACV,SAAS,EACT,WAAW,EACX,cAAc,EACd,MAAM,EACN,aAAa,EACb,QAAQ,EACR,UAAU,EACV,OAAO,GACR,EAAE,EAAE;IACH,OAAO,CACL,eACE,SAAS,EAAC,+IAA+I,EACzJ,KAAK,EAAE;YACL,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;YACtC,eAAe,EAAE,MAAM,CAAC,eAAe;YACvC,QAAQ,EAAE,MAAM,CAAC,QAAQ;SAC1B,aAGD,eACE,SAAS,EAAC,gFAAgF,EAC1F,KAAK,EAAE;oBACL,UAAU,EAAE,2BAA2B,MAAM,CAAC,YAAY,QAAQ,MAAM,CAAC,WAAW,QAAQ;iBAC7F,aAED,eAAK,SAAS,EAAC,eAAe,aAC5B,aAAI,SAAS,EAAC,mCAAmC,YAAE,KAAK,GAAM,EAC9D,YAAG,SAAS,EAAC,8BAA8B,oCAAwB,IAC/D,EACN,eAAK,SAAS,EAAC,YAAY,aACzB,iBACE,OAAO,EAAE,UAAU,EACnB,SAAS,EAAC,8EAA8E,gBAC7E,eAAe,YAEzB,WAAW,CAAC,CAAC,CAAC,KAAC,SAAS,IAAC,IAAI,EAAE,EAAE,GAAI,CAAC,CAAC,CAAC,KAAC,SAAS,IAAC,IAAI,EAAE,EAAE,GAAI,GACzD,EACT,iBACE,OAAO,EAAE,OAAO,EAChB,SAAS,EAAC,8EAA8E,gBAC7E,YAAY,YAEvB,KAAC,CAAC,IAAC,IAAI,EAAE,EAAE,GAAI,GACR,IACL,IACF,EAGL,CAAC,WAAW,IAAI,CACf,8BACE,KAAC,WAAW,IACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,SAAS,EAAE,MAAM,CAAC,SAAS,EAC3B,YAAY,EAAE,MAAM,CAAC,YAAY,GACjC,EACF,KAAC,SAAS,IACR,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,MAAM,CAAC,YAAY,GACjC,IACD,CACJ,IACG,CACP,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface FloatingButtonProps {
|
|
3
|
+
onClick: () => void;
|
|
4
|
+
primaryColor: string;
|
|
5
|
+
accentColor: string;
|
|
6
|
+
}
|
|
7
|
+
export declare const FloatingButton: React.FC<FloatingButtonProps>;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=FloatingButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FloatingButton.d.ts","sourceRoot":"","sources":["../../components/FloatingButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,UAAU,mBAAmB;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAiBxD,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { MessageCircle } from 'lucide-react';
|
|
3
|
+
export const FloatingButton = ({ onClick, primaryColor, accentColor, }) => {
|
|
4
|
+
return (_jsx("button", { onClick: onClick, className: "w-14 h-14 text-white rounded-full shadow-lg hover:shadow-xl hover:scale-110 flex items-center justify-center transition-all mb-1", style: {
|
|
5
|
+
background: `linear-gradient(135deg, ${primaryColor}, ${accentColor})`,
|
|
6
|
+
}, "aria-label": "Open chat", children: _jsx(MessageCircle, { size: 28 }) }));
|
|
7
|
+
};
|
|
8
|
+
//# sourceMappingURL=FloatingButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FloatingButton.js","sourceRoot":"","sources":["../../components/FloatingButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAQ7C,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,OAAO,EACP,YAAY,EACZ,WAAW,GACZ,EAAE,EAAE;IACH,OAAO,CACL,iBACE,OAAO,EAAE,OAAO,EAChB,SAAS,EAAC,kIAAkI,EAC5I,KAAK,EAAE;YACL,UAAU,EAAE,2BAA2B,YAAY,KAAK,WAAW,GAAG;SACvE,gBACU,WAAW,YAEtB,KAAC,aAAa,IAAC,IAAI,EAAE,EAAE,GAAI,GACpB,CACV,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React, { FormEvent } from 'react';
|
|
2
|
+
interface InputFormProps {
|
|
3
|
+
inputValue: string;
|
|
4
|
+
isLoading: boolean;
|
|
5
|
+
onInputChange: (value: string) => void;
|
|
6
|
+
onSubmit: (e: FormEvent<HTMLFormElement>) => void;
|
|
7
|
+
primaryColor: string;
|
|
8
|
+
}
|
|
9
|
+
export declare const InputForm: React.FC<InputFormProps>;
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=InputForm.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputForm.d.ts","sourceRoot":"","sources":["../../components/InputForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,UAAU,cAAc;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,QAAQ,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IAClD,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAqC9C,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Send } from 'lucide-react';
|
|
3
|
+
export const InputForm = ({ inputValue, isLoading, onInputChange, onSubmit, primaryColor, }) => {
|
|
4
|
+
return (_jsx("form", { onSubmit: onSubmit, className: "border-t border-neutral-200/50 dark:border-neutral-700/50 bg-gradient-to-r from-white to-neutral-50/50 dark:from-neutral-800 dark:to-neutral-800/50 p-4 flex-shrink-0", children: _jsxs("div", { className: "flex gap-2.5", children: [_jsx("input", { type: "text", value: inputValue, onChange: (e) => onInputChange(e.target.value), placeholder: "Type a message...", disabled: isLoading, className: "flex-1 px-4 py-2.5 border border-neutral-200 dark:border-neutral-600 rounded-xl focus:outline-none focus:ring-2 focus:border-transparent dark:bg-neutral-700 dark:text-white placeholder-neutral-400 dark:placeholder-neutral-500 transition-all", style: { '--tw-ring-color': primaryColor } }), _jsx("button", { type: "submit", disabled: isLoading || !inputValue.trim(), className: "px-4 py-2.5 text-white rounded-xl hover:shadow-lg disabled:opacity-50 transition-all duration-200 hover:scale-105 flex items-center justify-center", style: {
|
|
5
|
+
backgroundColor: primaryColor,
|
|
6
|
+
boxShadow: `0 2px 8px ${primaryColor}30`
|
|
7
|
+
}, children: isLoading ? (_jsx("div", { className: "w-5 h-5 border-2 border-white/30 border-t-white rounded-full animate-spin" })) : (_jsx(Send, { size: 20 })) })] }) }));
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=InputForm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputForm.js","sourceRoot":"","sources":["../../components/InputForm.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAUpC,MAAM,CAAC,MAAM,SAAS,GAA6B,CAAC,EAClD,UAAU,EACV,SAAS,EACT,aAAa,EACb,QAAQ,EACR,YAAY,GACb,EAAE,EAAE;IACH,OAAO,CACL,eAAM,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAC,uKAAuK,YACzM,eAAK,SAAS,EAAC,cAAc,aAC3B,gBACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAC9C,WAAW,EAAC,mBAAmB,EAC/B,QAAQ,EAAE,SAAS,EACnB,SAAS,EAAC,kPAAkP,EAC5P,KAAK,EAAE,EAAE,iBAAiB,EAAE,YAAY,EAAS,GACjD,EACF,iBACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,SAAS,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,EACzC,SAAS,EAAC,oJAAoJ,EAC9J,KAAK,EAAE;wBACL,eAAe,EAAE,YAAY;wBAC7B,SAAS,EAAE,aAAa,YAAY,IAAI;qBACzC,YAEA,SAAS,CAAC,CAAC,CAAC,CACX,cAAK,SAAS,EAAC,2EAA2E,GAAG,CAC9F,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,GAAI,CACnB,GACM,IACL,GACD,CACR,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Message } from '../types';
|
|
3
|
+
interface MessageListProps {
|
|
4
|
+
messages: Message[];
|
|
5
|
+
messagesEndRef: React.RefObject<HTMLDivElement | null>;
|
|
6
|
+
textColor: string;
|
|
7
|
+
primaryColor: string;
|
|
8
|
+
}
|
|
9
|
+
export declare const MessageList: React.FC<MessageListProps>;
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=MessageList.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../components/MessageList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAEnC,UAAU,gBAAgB;IACxB,QAAQ,EAAE,OAAO,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACvD,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAmClD,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
export const MessageList = ({ messages, messagesEndRef, textColor, primaryColor, }) => {
|
|
3
|
+
return (_jsxs("div", { className: "flex-1 overflow-y-auto p-4 space-y-3 bg-gradient-to-b from-neutral-50/50 to-neutral-50 dark:from-neutral-800/50 dark:to-neutral-800", children: [messages.map((msg) => (_jsx("div", { className: `flex ${msg.type === 'user' ? 'justify-end' : 'justify-start'} animate-fadeIn`, children: _jsx("div", { className: `max-w-xs px-4 py-2.5 rounded-xl shadow-sm transition-all ${msg.type === 'user'
|
|
4
|
+
? 'text-white rounded-br-none'
|
|
5
|
+
: 'bg-white dark:bg-neutral-700 text-neutral-900 dark:text-neutral-100 rounded-bl-none'}`, style: msg.type === 'user'
|
|
6
|
+
? {
|
|
7
|
+
backgroundColor: primaryColor,
|
|
8
|
+
boxShadow: `0 2px 8px ${primaryColor}20`
|
|
9
|
+
}
|
|
10
|
+
: {}, children: _jsx("p", { className: "text-sm leading-relaxed", children: msg.text }) }) }, msg.id))), _jsx("div", { ref: messagesEndRef })] }));
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=MessageList.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MessageList.js","sourceRoot":"","sources":["../../components/MessageList.tsx"],"names":[],"mappings":";AAUA,MAAM,CAAC,MAAM,WAAW,GAA+B,CAAC,EACtD,QAAQ,EACR,cAAc,EACd,SAAS,EACT,YAAY,GACb,EAAE,EAAE;IACH,OAAO,CACL,eAAK,SAAS,EAAC,qIAAqI,aACjJ,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACrB,cAEE,SAAS,EAAE,QAAQ,GAAG,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,eAAe,iBAAiB,YAEzF,cACE,SAAS,EAAE,4DACT,GAAG,CAAC,IAAI,KAAK,MAAM;wBACjB,CAAC,CAAC,4BAA4B;wBAC9B,CAAC,CAAC,qFACN,EAAE,EACF,KAAK,EACH,GAAG,CAAC,IAAI,KAAK,MAAM;wBACjB,CAAC,CAAC;4BACE,eAAe,EAAE,YAAY;4BAC7B,SAAS,EAAE,aAAa,YAAY,IAAI;yBACzC;wBACH,CAAC,CAAC,EAAE,YAGR,YAAG,SAAS,EAAC,yBAAyB,YAAE,GAAG,CAAC,IAAI,GAAK,GACjD,IAnBD,GAAG,CAAC,EAAE,CAoBP,CACP,CAAC,EACF,cAAK,GAAG,EAAE,cAAiD,GAAI,IAC3D,CACP,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NeuroBot.d.ts","sourceRoot":"","sources":["../../components/NeuroBot.tsx"],"names":[],"mappings":"AAAA,OAAc,EAA+B,EAAE,EAAa,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAE,aAAa,EAAuB,MAAM,UAAU,CAAC;AAoB9D,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAsItC,CAAC"}
|