{"_id":"@caesor/wesley-chat-components","_rev":"2-7e7a86dde4cb71044d6274e04e5b583b","name":"@caesor/wesley-chat-components","dist-tags":{"latest":"0.1.4"},"versions":{"0.1.3":{"name":"@caesor/wesley-chat-components","version":"0.1.3","keywords":["react","chat","ai","components","antd"],"author":{"name":"Wesley Chat Components Team","email":"support@wesley-chat.dev"},"license":"MIT","_id":"@caesor/wesley-chat-components@0.1.3","maintainers":[{"name":"caesor","email":"liaozksysu@gmail.com"}],"homepage":"https://github.com/Caesor/wesley-chat-components#readme","bugs":{"url":"https://github.com/Caesor/wesley-chat-components/issues"},"dist":{"shasum":"80dbd37fe26c0a1d482064c71f59b59c9a09634b","tarball":"https://registry.npmjs.org/@caesor/wesley-chat-components/-/wesley-chat-components-0.1.3.tgz","fileCount":8,"integrity":"sha512-6zrgmfWg4waQFhFxKfSHkEp+/ZqRUZNPVAaNbz1RhEgnyIZadrw9HCePkV0GszXnMwlepE5/AE81URRpaSPB6A==","signatures":[{"sig":"MEQCIDL5pR1qKIuY/xqmDSHNyE+uscTnDiPVOYGm6d+GC9JzAiBkR4q7z2nG0rAPZvPjBtpdlJO1ZJXucCe86RWWssE/Sg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":184917},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"49ab49baa7b75326bfe8b8a428b3ab7dc1467917","scripts":{"dev":"tsup src/index.ts --format cjs,esm --dts --watch","lint":"eslint src/**/*.ts*","build":"tsup src/index.ts --format cjs,esm --dts --external react","prepublishOnly":"npm run build"},"_npmUser":{"name":"caesor","email":"liaozksysu@gmail.com"},"repository":{"url":"git+https://github.com/Caesor/wesley-chat-components.git","type":"git"},"_npmVersion":"11.5.2","description":"Shared React components for AI chat integration","directories":{},"_nodeVersion":"23.11.0","dependencies":{"rehype-raw":"^7.0.0","remark-gfm":"^4.0.0","highlight.js":"^11.0.0","react-markdown":"^9.0.0","rehype-highlight":"^7.0.0"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"antd":"^5.0.0","tsup":"^8.0.0","react":"^18.0.0","eslint":"^8.0.0","react-dom":"^18.0.0","typescript":"^5.0.0","@types/react":"^18.0.0","@ant-design/x":"^1.0.0","@types/react-dom":"^18.0.0","@typescript-eslint/parser":"^6.0.0","@typescript-eslint/eslint-plugin":"^6.0.0"},"peerDependencies":{"antd":">=5.0.0","react":">=18.0.0","react-dom":">=18.0.0","@ant-design/x":">=1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/wesley-chat-components_0.1.3_1758877497196_0.2649682487654237","host":"s3://npm-registry-packages-npm-production"}},"0.1.4":{"name":"@caesor/wesley-chat-components","version":"0.1.4","description":"Shared React components for AI chat integration","main":"dist/index.js","module":"dist/index.esm.js","types":"dist/index.d.ts","scripts":{"build":"tsup src/index.ts --format cjs,esm --dts --external react","dev":"tsup src/index.ts --format cjs,esm --dts --watch","lint":"eslint src/**/*.ts*","prepublishOnly":"npm run build"},"publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"},"repository":{"type":"git","url":"git+https://github.com/Caesor/wesley-chat-components.git"},"keywords":["react","chat","ai","components","antd"],"author":{"name":"Wesley Chat Components Team","email":"support@wesley-chat.dev"},"license":"MIT","peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0","antd":">=5.0.0","@ant-design/x":">=1.0.0"},"devDependencies":{"tsup":"^8.0.0","typescript":"^5.0.0","@types/react":"^18.0.0","@types/react-dom":"^18.0.0","eslint":"^8.0.0","@typescript-eslint/parser":"^6.0.0","@typescript-eslint/eslint-plugin":"^6.0.0","antd":"^5.0.0","@ant-design/x":"^1.0.0","react":"^18.0.0","react-dom":"^18.0.0"},"dependencies":{"react-markdown":"^9.0.0","remark-gfm":"^4.0.0","rehype-highlight":"^7.0.0","rehype-raw":"^7.0.0","highlight.js":"^11.0.0"},"_id":"@caesor/wesley-chat-components@0.1.4","gitHead":"656b3ef18c26494a391c3f0545c9c455ec069072","bugs":{"url":"https://github.com/Caesor/wesley-chat-components/issues"},"homepage":"https://github.com/Caesor/wesley-chat-components#readme","_nodeVersion":"23.11.0","_npmVersion":"11.5.2","dist":{"integrity":"sha512-6EDqSBfRliVhCeutr3eNHDs6RqoDmAxph5eqKLxuKdiAAV0SkPWqNEQIGeJkfr+tGGHxV3XqXweLphHXOXJr7g==","shasum":"7987be7317b9dd8ce635ea63d2103a16404279b0","tarball":"https://registry.npmjs.org/@caesor/wesley-chat-components/-/wesley-chat-components-0.1.4.tgz","fileCount":8,"unpackedSize":184917,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDC8Im9SP+V6QWYEF9VUfv9Y9d0uoc6i0jkBrd1Vp9ZVwIgN/ZelFTBrNipqmkkzBfmxYiRH4uX+SVrXbgYISN0Rw4="}]},"_npmUser":{"name":"caesor","email":"liaozksysu@gmail.com"},"directories":{},"maintainers":[{"name":"caesor","email":"liaozksysu@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/wesley-chat-components_0.1.4_1758877654445_0.6759867566186595"},"_hasShrinkwrap":false}},"time":{"created":"2025-09-26T09:04:57.122Z","modified":"2025-09-26T09:07:34.852Z","0.1.3":"2025-09-26T09:04:57.362Z","0.1.4":"2025-09-26T09:07:34.674Z"},"bugs":{"url":"https://github.com/Caesor/wesley-chat-components/issues"},"author":{"name":"Wesley Chat Components Team","email":"support@wesley-chat.dev"},"license":"MIT","homepage":"https://github.com/Caesor/wesley-chat-components#readme","keywords":["react","chat","ai","components","antd"],"repository":{"type":"git","url":"git+https://github.com/Caesor/wesley-chat-components.git"},"description":"Shared React components for AI chat integration","maintainers":[{"name":"caesor","email":"liaozksysu@gmail.com"}],"readme":"# @caesor/wesley-chat-components\n\nShared React components for AI chat integration with context-aware interactions.\n\n## Installation\n\n### Using GitHub Package Registry\n\n1. Create a `.npmrc` file in your project root:\n\n```bash\n@caesor:registry=https://npm.pkg.github.com\n//npm.pkg.github.com/:_authToken=${GITHUB_TOKEN}\n```\n\n2. Set your GitHub token as an environment variable:\n\n```bash\nexport GITHUB_TOKEN=your_github_personal_access_token\n```\n\nNote: You need a GitHub personal access token with `read:packages` permission. [Create one here](https://github.com/settings/tokens/new?scopes=read:packages).\n\n3. Install the package:\n\n```bash\n# Using npm\nnpm install @caesor/wesley-chat-components\n\n# Using yarn\nyarn add @caesor/wesley-chat-components\n\n# Using pnpm\npnpm add @caesor/wesley-chat-components\n```\n\n## Features\n\n- 🤖 **AI Chat Widget** - Full-featured chat interface with streaming support\n- 🎯 **Context-Aware** - Different behaviors based on trigger context\n- 🎨 **Customizable** - Flexible theming and configuration options\n- 📝 **Markdown Support** - Rich text rendering with syntax highlighting\n- 🔄 **Streaming Responses** - Real-time message streaming\n- 📱 **Responsive** - Works on all devices\n\n## Quick Start\n\n### Basic Chat Widget\n\n```tsx\nimport { ChatWidget } from '@caesor/wesley-chat-components';\n\nfunction App() {\n  return (\n    <ChatWidget\n      apiEndpoint=\"/api/chat\"\n      variant=\"floating\"\n      position=\"bottom-right\"\n      title=\"AI Assistant\"\n      initialMessage=\"Hello! How can I help you today?\"\n    />\n  );\n}\n```\n\n### Replace Email Links with AI Agent\n\nReplace traditional `mailto:` links with AI-powered interactions:\n\n```tsx\nimport { AgentDialog, createAgentContext } from '@caesor/wesley-chat-components';\n\n// Before: <a href=\"mailto:contact@example.com\">Contact Us</a>\n\n// After:\n<AgentDialog\n  context={createAgentContext('contact')}\n  className=\"contact-button\"\n>\n  Contact Us\n</AgentDialog>\n```\n\n### Context-Aware Templates\n\nDifferent contexts for different interaction points:\n\n```tsx\n// Template inquiry\n<AgentDialog\n  context={{\n    trigger: 'template',\n    metadata: {\n      templateId: 'tech-startup',\n      templateTitle: 'Tech Startup Template',\n      templateFeatures: ['Hero animations', 'Feature cards', 'Pricing tables']\n    }\n  }}\n>\n  Request This Design\n</AgentDialog>\n\n// Service inquiry\n<AgentDialog\n  context={{\n    trigger: 'service',\n    metadata: {\n      serviceType: 'AI Integration'\n    }\n  }}\n>\n  Learn More About AI Integration\n</AgentDialog>\n```\n\n## Components\n\n### ChatWidget\n\nMain chat interface component with multiple display variants.\n\n```tsx\n<ChatWidget\n  // API Configuration\n  apiEndpoint=\"/api/chat/stream\"\n  apiKey=\"your-api-key\"\n\n  // UI Configuration\n  variant=\"floating\" // 'floating' | 'inline' | 'modal'\n  position=\"bottom-right\"\n  theme=\"light\"\n\n  // Content\n  title=\"AI Assistant\"\n  subtitle=\"How can I help?\"\n  placeholder=\"Type your message...\"\n  initialMessage=\"Welcome! How can I assist you today?\"\n  suggestedQuestions={[\n    \"Tell me about your services\",\n    \"I need help with a project\"\n  ]}\n\n  // Behavior\n  autoOpen={false}\n  useStreaming={true}\n  persistMessages={false}\n\n  // Events\n  onOpen={() => console.log('Chat opened')}\n  onClose={() => console.log('Chat closed')}\n  onMessageSent={(message, context) => console.log('Sent:', message)}\n  onMessageReceived={(message) => console.log('Received:', message)}\n  onError={(error) => console.error('Error:', error)}\n/>\n```\n\n### AgentDialog\n\nButton wrapper that opens chat with specific context.\n\n```tsx\n<AgentDialog\n  context={{\n    trigger: 'header',\n    metadata: { page: 'home' }\n  }}\n  widgetProps={{\n    apiEndpoint: '/api/chat',\n    title: 'Sales Assistant'\n  }}\n  className=\"cta-button\"\n  disabled={false}\n>\n  Start Conversation\n</AgentDialog>\n```\n\n### MarkdownRenderer\n\nRenders markdown content with syntax highlighting.\n\n```tsx\nimport { MarkdownRenderer } from '@caesor/wesley-chat-components';\n\n<MarkdownRenderer\n  content=\"# Hello World\\n\\nThis is **markdown** content with `code`.\"\n  className=\"markdown-content\"\n/>\n```\n\n## Context System\n\nThe context system helps provide relevant initial messages and suggestions based on where the user triggered the chat.\n\n### Available Contexts\n\n- `header` - Navigation/header interactions\n- `template` - Template/product inquiries\n- `service` - Service-specific questions\n- `contact` - General contact requests\n- `footer` - Footer link interactions\n- `general` - Default context\n\n### Using Hooks\n\n```tsx\nimport { useAgentContext } from '@caesor/wesley-chat-components';\n\nfunction MyComponent() {\n  const context = useAgentContext({\n    trigger: 'template',\n    metadata: {\n      templateId: 'portfolio',\n      templateTitle: 'Portfolio Template'\n    }\n  });\n\n  return (\n    <ChatWidget\n      context={context}\n      // Context will automatically set initial message and suggestions\n    />\n  );\n}\n```\n\n## API Endpoint Requirements\n\nYour API endpoint should accept POST requests with the following format:\n\n### Request\n\n```typescript\n{\n  message: string;\n  context?: AgentContext;\n  messages?: Message[];\n}\n```\n\n### Response (Streaming)\n\nFor streaming responses, return Server-Sent Events:\n\n```\ndata: {\"type\": \"content\", \"content\": \"Hello \"}\ndata: {\"type\": \"content\", \"content\": \"world!\"}\ndata: {\"type\": \"done\"}\n```\n\n### Response (Non-streaming)\n\n```json\n{\n  \"message\": \"Response from the AI assistant\",\n  \"metadata\": {}\n}\n```\n\n## Styling\n\nThe components use Ant Design (antd) for UI elements. Make sure to import antd styles in your app:\n\n```tsx\n// In your main app file\nimport 'antd/dist/reset.css';\n```\n\n## TypeScript\n\nFull TypeScript support with exported types:\n\n```tsx\nimport type {\n  ChatWidgetProps,\n  AgentDialogProps,\n  AgentContext,\n  Message,\n  ChatState\n} from '@caesor/wesley-chat-components';\n```\n\n## Development\n\n### Local Development\n\n```bash\n# Clone the repository\ngit clone https://github.com/Caesor/wesley-chat-components.git\ncd wesley-chat-components\n\n# Install dependencies\nnpm install\n\n# Build the package\nnpm run build\n\n# Link for local testing\nnpm link\n```\n\n### Testing Locally\n\nIn your project:\n\n```bash\nnpm link @caesor/wesley-chat-components\n```\n\n## Security\n\nSee [SECURITY.md](SECURITY.md) for our security policy and how to report vulnerabilities.\n\n## License\n\nMIT - See [LICENSE](LICENSE) file for details.\n\n## Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request.\n\n## Support\n\n- GitHub Issues: [Report bugs](https://github.com/Caesor/wesley-chat-components/issues)\n- Email: support@wesley-chat.dev","readmeFilename":"README.md"}