@kite-copilot/chat-panel 0.1.0 → 0.1.1
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 +16 -16
- package/dist/embed.global.js +129 -0
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/styles.css +2 -0
- package/package.json +27 -7
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# @kite/chat-panel
|
|
1
|
+
# @kite-copilot/chat-panel
|
|
2
2
|
|
|
3
3
|
An AI-powered chat panel component for React applications. This package provides a floating chat interface that can integrate with any AI backend agent to provide intelligent assistance to users.
|
|
4
4
|
|
|
@@ -14,11 +14,11 @@ An AI-powered chat panel component for React applications. This package provides
|
|
|
14
14
|
## Installation
|
|
15
15
|
|
|
16
16
|
```bash
|
|
17
|
-
npm install @kite/chat-panel
|
|
17
|
+
npm install @kite-copilot/chat-panel
|
|
18
18
|
# or
|
|
19
|
-
yarn add @kite/chat-panel
|
|
19
|
+
yarn add @kite-copilot/chat-panel
|
|
20
20
|
# or
|
|
21
|
-
pnpm add @kite/chat-panel
|
|
21
|
+
pnpm add @kite-copilot/chat-panel
|
|
22
22
|
```
|
|
23
23
|
|
|
24
24
|
### Peer Dependencies
|
|
@@ -34,8 +34,8 @@ npm install react react-dom lucide-react
|
|
|
34
34
|
### Basic Usage
|
|
35
35
|
|
|
36
36
|
```tsx
|
|
37
|
-
import { ChatPanel, ChatPanelProvider } from '@kite/chat-panel'
|
|
38
|
-
import '@kite/chat-panel/styles.css'
|
|
37
|
+
import { ChatPanel, ChatPanelProvider } from '@kite-copilot/chat-panel'
|
|
38
|
+
import '@kite-copilot/chat-panel/styles.css'
|
|
39
39
|
|
|
40
40
|
function App() {
|
|
41
41
|
// Get the current user from your authentication system
|
|
@@ -53,8 +53,8 @@ function App() {
|
|
|
53
53
|
### With Navigation Integration
|
|
54
54
|
|
|
55
55
|
```tsx
|
|
56
|
-
import { ChatPanel, ChatPanelProvider } from '@kite/chat-panel'
|
|
57
|
-
import '@kite/chat-panel/styles.css'
|
|
56
|
+
import { ChatPanel, ChatPanelProvider } from '@kite-copilot/chat-panel'
|
|
57
|
+
import '@kite-copilot/chat-panel/styles.css'
|
|
58
58
|
import { useRouter } from 'next/navigation'
|
|
59
59
|
|
|
60
60
|
function App() {
|
|
@@ -235,7 +235,7 @@ const customFolders = [
|
|
|
235
235
|
Import the CSS file in your app:
|
|
236
236
|
|
|
237
237
|
```tsx
|
|
238
|
-
import '@kite/chat-panel/styles.css'
|
|
238
|
+
import '@kite-copilot/chat-panel/styles.css'
|
|
239
239
|
```
|
|
240
240
|
|
|
241
241
|
### With Tailwind CSS
|
|
@@ -247,7 +247,7 @@ If you're using Tailwind, extend your config with our preset:
|
|
|
247
247
|
module.exports = {
|
|
248
248
|
content: [
|
|
249
249
|
// ... your paths
|
|
250
|
-
'./node_modules/@kite/chat-panel/dist/**/*.{js,mjs}'
|
|
250
|
+
'./node_modules/@kite-copilot/chat-panel/dist/**/*.{js,mjs}'
|
|
251
251
|
],
|
|
252
252
|
theme: {
|
|
253
253
|
extend: {
|
|
@@ -294,7 +294,7 @@ import type {
|
|
|
294
294
|
Message,
|
|
295
295
|
GuideWithSteps,
|
|
296
296
|
Folder,
|
|
297
|
-
} from '@kite/chat-panel'
|
|
297
|
+
} from '@kite-copilot/chat-panel'
|
|
298
298
|
```
|
|
299
299
|
|
|
300
300
|
## Events
|
|
@@ -318,7 +318,7 @@ window.addEventListener('agentActionComplete', (e) => {
|
|
|
318
318
|
// app/providers.tsx
|
|
319
319
|
'use client'
|
|
320
320
|
|
|
321
|
-
import { ChatPanelProvider } from '@kite/chat-panel'
|
|
321
|
+
import { ChatPanelProvider } from '@kite-copilot/chat-panel'
|
|
322
322
|
import { useAuth } from './auth' // Your auth provider
|
|
323
323
|
|
|
324
324
|
export function Providers({ children }) {
|
|
@@ -338,7 +338,7 @@ export function Providers({ children }) {
|
|
|
338
338
|
|
|
339
339
|
// app/layout.tsx
|
|
340
340
|
import { Providers } from './providers'
|
|
341
|
-
import '@kite/chat-panel/styles.css'
|
|
341
|
+
import '@kite-copilot/chat-panel/styles.css'
|
|
342
342
|
|
|
343
343
|
export default function RootLayout({ children }) {
|
|
344
344
|
return (
|
|
@@ -353,7 +353,7 @@ export default function RootLayout({ children }) {
|
|
|
353
353
|
// app/page.tsx
|
|
354
354
|
'use client'
|
|
355
355
|
|
|
356
|
-
import { ChatPanel } from '@kite/chat-panel'
|
|
356
|
+
import { ChatPanel } from '@kite-copilot/chat-panel'
|
|
357
357
|
|
|
358
358
|
export default function Page() {
|
|
359
359
|
return (
|
|
@@ -369,8 +369,8 @@ export default function Page() {
|
|
|
369
369
|
|
|
370
370
|
```tsx
|
|
371
371
|
import { BrowserRouter, useLocation, useNavigate } from 'react-router-dom'
|
|
372
|
-
import { ChatPanel, ChatPanelProvider } from '@kite/chat-panel'
|
|
373
|
-
import '@kite/chat-panel/styles.css'
|
|
372
|
+
import { ChatPanel, ChatPanelProvider } from '@kite-copilot/chat-panel'
|
|
373
|
+
import '@kite-copilot/chat-panel/styles.css'
|
|
374
374
|
import { useAuth } from './auth' // Your auth provider
|
|
375
375
|
|
|
376
376
|
function ChatPanelWithRouter() {
|