@makemore/agent-frontend 2.7.2 → 2.8.1

package/package.json

@@ -1,21 +1,34 @@
 {
   "name": "@makemore/agent-frontend",
-  "version": "2.7.2",
-  "description": "A lightweight chat widget for AI agents built with Preact. Embed conversational AI into any website with a single script tag.",
+  "version": "2.8.1",
+  "description": "A lightweight chat widget for AI agents. Use as an embeddable script tag or import directly into React/Preact projects.",
   "type": "module",
-  "main": "dist/chat-widget.js",
-  "module": "src/index.js",
+  "main": "dist/chat-widget.cjs.js",
+  "module": "dist/chat-widget.esm.js",
+  "browser": "dist/chat-widget.js",
+  "exports": {
+    ".": {
+      "import": "./dist/chat-widget.esm.js",
+      "require": "./dist/chat-widget.cjs.js",
+      "browser": "./dist/chat-widget.js"
+    },
+    "./react": {
+      "import": "./dist/react.esm.js",
+      "require": "./dist/react.cjs.js"
+    },
+    "./embed": "./dist/chat-widget.js",
+    "./css": "./dist/chat-widget.css"
+  },
   "files": [
-    "dist/chat-widget.js",
-    "dist/chat-widget.css",
-    "dist/chat-widget-markdown.js",
+    "dist/",
     "src/",
     "README.md",
     "LICENSE"
   ],
   "scripts": {
-    "build": "esbuild src/index.js --bundle --minify --format=iife --global-name=ChatWidgetModule --outfile=dist/chat-widget.js && npm run copy",
-    "build:dev": "esbuild src/index.js --bundle --format=iife --global-name=ChatWidgetModule --outfile=dist/chat-widget.js --sourcemap && npm run copy",
+    "build": "node build.js",
+    "build:dev": "node build.js --dev",
+    "build:embed": "esbuild src/index.js --bundle --minify --format=iife --global-name=ChatWidgetModule --outfile=dist/chat-widget.js",
     "watch": "node watch.js",
     "copy": "cp -f dist/chat-widget.js ../django_agent_studio/static/agent-frontend/chat-widget.js 2>/dev/null || true && echo 'Copied to django_agent_studio'",
     "prepublishOnly": "npm run build",
@@ -52,6 +65,18 @@
     "htm": "^3.1.1",
     "preact": "^10.19.3"
   },
+  "peerDependencies": {
+    "react": ">=16.8.0",
+    "react-dom": ">=16.8.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    }
+  },
   "devDependencies": {
     "esbuild": "^0.20.0"
   }

package/src/react.js

@@ -0,0 +1,78 @@
+/**
+ * React-compatible exports for @makemore/agent-frontend
+ * 
+ * This module provides React-compatible components and hooks.
+ * It uses preact/compat under the hood, which provides full React API compatibility.
+ * 
+ * Usage in React projects:
+ * 
+ *   import { ChatWidget, useChat, useModels } from '@makemore/agent-frontend/react';
+ *   
+ *   function App() {
+ *     return (
+ *       <ChatWidget 
+ *         config={{
+ *           backendUrl: 'https://api.example.com',
+ *           agentKey: 'my-agent',
+ *         }}
+ *       />
+ *     );
+ *   }
+ * 
+ * Or use hooks directly for custom UI:
+ * 
+ *   import { useChat, createApiClient, mergeConfig } from '@makemore/agent-frontend/react';
+ *   
+ *   function CustomChat() {
+ *     const config = mergeConfig({ backendUrl: '...', agentKey: '...' });
+ *     const api = createApiClient(config, () => ({}), () => {});
+ *     const chat = useChat(config, api, null);
+ *     
+ *     return (
+ *       <div>
+ *         {chat.messages.map(msg => <div key={msg.id}>{msg.content}</div>)}
+ *         <button onClick={() => chat.sendMessage('Hello!')}>Send</button>
+ *       </div>
+ *     );
+ *   }
+ */
+
+// Components
+export { ChatWidget } from './components/ChatWidget.js';
+export { Header } from './components/Header.js';
+export { MessageList } from './components/MessageList.js';
+export { Message } from './components/Message.js';
+export { InputForm } from './components/InputForm.js';
+export { Sidebar } from './components/Sidebar.js';
+export { ModelSelector } from './components/ModelSelector.js';
+export { TaskList } from './components/TaskList.js';
+
+// Hooks
+export { useChat } from './hooks/useChat.js';
+export { useModels } from './hooks/useModels.js';
+export { useTasks } from './hooks/useTasks.js';
+
+// Utilities
+export { createApiClient } from './utils/api.js';
+export { mergeConfig, DEFAULT_CONFIG } from './utils/config.js';
+export {
+  generateId,
+  createStorage,
+  camelToSnake,
+  snakeToCamel,
+  keysToCamel,
+  keysToSnake,
+  parseMarkdown,
+  formatDate,
+  formatFileSize,
+  getFileTypeIcon,
+  getCSRFToken,
+} from './utils/helpers.js';
+
+// Re-export the imperative API for backwards compatibility
+export { ChatWidget as ChatWidgetAPI } from './index.js';
+
+// Default export is the main ChatWidget component
+import { ChatWidget as ChatWidgetComponent } from './components/ChatWidget.js';
+export default ChatWidgetComponent;
+