{"_id":"@ai-avatar/embed-sdk","_rev":"3-bf8b9c1b14df6a8a29b78c577579b2e6","name":"@ai-avatar/embed-sdk","dist-tags":{"latest":"0.1.2"},"versions":{"0.1.0":{"name":"@ai-avatar/embed-sdk","version":"0.1.0","keywords":["ai","avatar","chatbot","3d","embed","widget","react","vue"],"license":"MIT","_id":"@ai-avatar/embed-sdk@0.1.0","maintainers":[{"name":"xieshuhua","email":"xieshuhua1511@gmail.com"}],"homepage":"https://avataraisdk.com","bugs":{"url":"https://github.com/curry1511/ai_avatar_embed/issues"},"dist":{"shasum":"28baf51c71b2de75a18007a01bd48de90a87c491","tarball":"https://registry.npmjs.org/@ai-avatar/embed-sdk/-/embed-sdk-0.1.0.tgz","fileCount":26,"integrity":"sha512-MK9Y6qGjY5KXSr735KNOCJPUDdk4A3q2a1dmAj1H3XpnkIhKkzLX+4kTuwlSAjs5MIITQujdAGqOaidX6DtMmg==","signatures":[{"sig":"MEUCIDl5Y6kVHQ6FkSEbdkfzbRzKHE9X5mPAvdZUPaVrTAaNAiEA6EjnQbOJPqCknbslpr/VxV9LoGAcYoVBlekF3mG/PYU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":295008},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./vue":{"types":"./dist/vue.d.ts","import":"./dist/vue.js","require":"./dist/vue.cjs"},"./react":{"types":"./dist/react.d.ts","import":"./dist/react.js","require":"./dist/react.cjs"},"./types":{"types":"./dist/types.d.ts","import":"./dist/types.js","require":"./dist/types.cjs"}},"gitHead":"95666a616ec60b03ffea370fb5466bd72e03e8ea","scripts":{"dev":"tsup --watch","build":"tsup","typecheck":"tsc --noEmit","prepublishOnly":"npm run build"},"_npmUser":{"name":"xieshuhua","email":"xieshuhua1511@gmail.com"},"repository":{"url":"git+https://github.com/curry1511/ai_avatar_embed.git","type":"git","directory":"platforms/npm"},"_npmVersion":"10.7.0","description":"AI Avatar embed SDK — 3D 数字人嵌入到 React / Vue / 原生 JS 网站","directories":{},"sideEffects":false,"_nodeVersion":"20.20.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.0","tsup":"^8.3.0","react":"^18.3.0","typescript":"^5.9.0","@types/react":"^18.3.0"},"peerDependencies":{"vue":">=3.0.0","react":">=16.8.0"},"peerDependenciesMeta":{"vue":{"optional":true},"react":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/embed-sdk_0.1.0_1779764577124_0.26450107889448415","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@ai-avatar/embed-sdk","version":"0.1.1","keywords":["ai","avatar","chatbot","3d","embed","widget","react","vue"],"license":"MIT","_id":"@ai-avatar/embed-sdk@0.1.1","maintainers":[{"name":"xieshuhua","email":"xieshuhua1511@gmail.com"}],"homepage":"https://avataraisdk.com","bugs":{"url":"https://github.com/curry1511/ai_avatar_embed/issues"},"dist":{"shasum":"73b228b5971531fad653ecbc6154a689ef116c99","tarball":"https://registry.npmjs.org/@ai-avatar/embed-sdk/-/embed-sdk-0.1.1.tgz","fileCount":26,"integrity":"sha512-uSR++GIc+B7F9iR8j9koUqj8LzGTlRx+2BbLXpdQysQXsv7+omefgk2QmpNNgPAkMSU337q/48ZsyynYEhQ4QQ==","signatures":[{"sig":"MEUCIDIFynEedSs0RMuRc8mvgSFPCjFRFXtgSXrlCQXkBWrtAiEA6b32a7GhvBcYjgyIfZm7mhuGnvPFD6pPvFD7kNFNC2M=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":334998},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./vue":{"types":"./dist/vue.d.ts","import":"./dist/vue.js","require":"./dist/vue.cjs"},"./react":{"types":"./dist/react.d.ts","import":"./dist/react.js","require":"./dist/react.cjs"},"./types":{"types":"./dist/types.d.ts","import":"./dist/types.js","require":"./dist/types.cjs"}},"gitHead":"4fc6a1423d0d53001e1fb17d6eaf8e33f97ab9f5","scripts":{"dev":"tsup --watch","build":"tsup","typecheck":"tsc --noEmit","prepublishOnly":"npm run build"},"_npmUser":{"name":"xieshuhua","email":"xieshuhua1511@gmail.com"},"repository":{"url":"git+https://github.com/curry1511/ai_avatar_embed.git","type":"git","directory":"platforms/npm"},"_npmVersion":"10.7.0","description":"AI Avatar embed SDK — 3D 数字人嵌入到 React / Vue / 原生 JS 网站","directories":{},"sideEffects":false,"_nodeVersion":"20.20.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.0","tsup":"^8.3.0","react":"^18.3.0","typescript":"^5.9.0","@types/react":"^18.3.0"},"peerDependencies":{"vue":">=3.0.0","react":">=16.8.0"},"peerDependenciesMeta":{"vue":{"optional":true},"react":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/embed-sdk_0.1.1_1779767131837_0.7705990106374856","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@ai-avatar/embed-sdk","version":"0.1.2","description":"AI Avatar embed SDK — 3D 数字人嵌入到 React / Vue / 原生 JS 网站","keywords":["ai","avatar","chatbot","3d","embed","widget","react","vue"],"license":"MIT","homepage":"https://avataraisdk.com","repository":{"type":"git","url":"git+https://github.com/curry1511/ai_avatar_embed.git","directory":"platforms/npm"},"bugs":{"url":"https://github.com/curry1511/ai_avatar_embed/issues"},"type":"module","sideEffects":false,"main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./react":{"types":"./dist/react.d.ts","import":"./dist/react.js","require":"./dist/react.cjs"},"./vue":{"types":"./dist/vue.d.ts","import":"./dist/vue.js","require":"./dist/vue.cjs"},"./types":{"types":"./dist/types.d.ts","import":"./dist/types.js","require":"./dist/types.cjs"}},"scripts":{"build":"tsup","dev":"tsup --watch","typecheck":"tsc --noEmit","prepublishOnly":"npm run build"},"peerDependencies":{"react":">=16.8.0","vue":">=3.0.0"},"peerDependenciesMeta":{"react":{"optional":true},"vue":{"optional":true}},"devDependencies":{"@types/react":"^18.3.0","react":"^18.3.0","tsup":"^8.3.0","typescript":"^5.9.0","vue":"^3.5.0"},"publishConfig":{"access":"public"},"_id":"@ai-avatar/embed-sdk@0.1.2","gitHead":"2a7c13630020a970162f008df561e0972b85572f","_nodeVersion":"20.20.0","_npmVersion":"10.7.0","dist":{"integrity":"sha512-YFSIZTv6m7hYCclkzauIIciidM9NtkJNpE8R15opSlvRvkOzxutc7OCyhU/xhEbGgrCmmYg2n4+hkllEpALOSw==","shasum":"f5e84dbb93531eaf38dd439b82ca7166b2ac3da6","tarball":"https://registry.npmjs.org/@ai-avatar/embed-sdk/-/embed-sdk-0.1.2.tgz","fileCount":26,"unpackedSize":338656,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQDtigp05zuf2/hFy3P+hky4OiNCQgFe55tjBwHvmr2YGAIhAISKP22BTtQaJogvKP2j+cxlV1G5EiRKRzE3GqgqEhM6"}]},"_npmUser":{"name":"xieshuhua","email":"xieshuhua1511@gmail.com"},"directories":{},"maintainers":[{"name":"xieshuhua","email":"xieshuhua1511@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/embed-sdk_0.1.2_1779778128478_0.5311733221583514"},"_hasShrinkwrap":false}},"time":{"created":"2026-05-26T03:02:56.973Z","modified":"2026-05-26T06:48:48.740Z","0.1.0":"2026-05-26T03:02:57.303Z","0.1.1":"2026-05-26T03:45:31.973Z","0.1.2":"2026-05-26T06:48:48.624Z"},"bugs":{"url":"https://github.com/curry1511/ai_avatar_embed/issues"},"license":"MIT","homepage":"https://avataraisdk.com","keywords":["ai","avatar","chatbot","3d","embed","widget","react","vue"],"repository":{"type":"git","url":"git+https://github.com/curry1511/ai_avatar_embed.git","directory":"platforms/npm"},"description":"AI Avatar embed SDK — 3D 数字人嵌入到 React / Vue / 原生 JS 网站","maintainers":[{"name":"xieshuhua","email":"xieshuhua1511@gmail.com"}],"readme":"# @ai-avatar/embed-sdk\r\n\r\n[![npm version](https://img.shields.io/npm/v/@ai-avatar/embed-sdk.svg)](https://www.npmjs.com/package/@ai-avatar/embed-sdk)\r\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\r\n\r\n把 [AI Avatar](https://avataraisdk.com) 3D 数字人嵌入你的 **React / Vue / 原生 JS** 网站。\r\n\r\n支持语音对话、实时口型同步、自定义外观。3 行代码集成。\r\n\r\n## 前置准备\r\n\r\n1. 在 [https://avataraisdk.com](https://avataraisdk.com) 注册账号\r\n2. 控制台 → API Keys → 生成 `sk-...` 格式的 key\r\n3. **控制台 → 域名白名单 → 添加你的开发和生产域名**\r\n   ```\r\n   http://localhost:5173    # Vite 开发服务器\r\n   http://localhost:3000    # CRA / Next.js 开发服务器\r\n   https://yourapp.com      # 生产环境\r\n   ```\r\n   不在白名单的 origin 会被后端拒绝(403),且数字人静默不显示。\r\n\r\n## 安装\r\n\r\n```bash\r\nnpm install @ai-avatar/embed-sdk\r\n# 或\r\npnpm add @ai-avatar/embed-sdk\r\n# 或\r\nyarn add @ai-avatar/embed-sdk\r\n```\r\n\r\n## React\r\n\r\n```jsx\r\nimport { AIAvatar } from '@ai-avatar/embed-sdk/react';\r\n\r\nexport default function App() {\r\n  return (\r\n    <>\r\n      <YourPageContent />\r\n      <AIAvatar\r\n        token=\"sk-...\"\r\n        agentId=\"agent_...\"\r\n        position=\"bottom-right\"\r\n        theme=\"light\"\r\n      />\r\n    </>\r\n  );\r\n}\r\n```\r\n\r\n### 用 ref 主动控制\r\n\r\n```jsx\r\nimport { useRef } from 'react';\r\nimport { AIAvatar, type AvatarInstance } from '@ai-avatar/embed-sdk/react';\r\n\r\nexport default function App() {\r\n  const avatarRef = useRef<AvatarInstance>(null);\r\n\r\n  return (\r\n    <>\r\n      <button onClick={() => avatarRef.current?.speak('你好,欢迎光临!')}>\r\n        让数字人说话\r\n      </button>\r\n      <AIAvatar ref={avatarRef} token=\"sk-...\" agentId=\"agent_...\" />\r\n    </>\r\n  );\r\n}\r\n```\r\n\r\n## Vue 3\r\n\r\n```vue\r\n<script setup>\r\nimport { ref } from 'vue';\r\nimport { AIAvatar } from '@ai-avatar/embed-sdk/vue';\r\n\r\nconst avatarRef = ref();\r\nconst greet = () => avatarRef.value?.speak('你好,欢迎光临!');\r\n</script>\r\n\r\n<template>\r\n  <button @click=\"greet\">让数字人说话</button>\r\n  <AIAvatar\r\n    ref=\"avatarRef\"\r\n    token=\"sk-...\"\r\n    agent-id=\"agent_...\"\r\n    position=\"bottom-right\"\r\n    @ready=\"() => console.log('数字人就绪')\"\r\n  />\r\n</template>\r\n```\r\n\r\n## 原生 JS / TypeScript\r\n\r\n> 注:原生 SDK 用**嵌套 config** 结构(`appearance` / `behavior` / `features`)。\r\n> React / Vue 封装组件接受**扁平 props**,内部自动归并 —— 用法不同,本质一样。\r\n\r\n```ts\r\nimport { AIAvatar } from '@ai-avatar/embed-sdk';\r\n\r\nconst avatar = AIAvatar.init({\r\n  token: 'sk-...',\r\n  agentId: 'agent_...',\r\n  appearance: {\r\n    position: 'bottom-right',\r\n    theme: 'light',\r\n    primaryColor: '#6366F1',\r\n    size: 'normal',\r\n  },\r\n  behavior: {\r\n    autoOpen: false,\r\n    greetingMessage: '你好,有什么可以帮你?',\r\n  },\r\n  features: {\r\n    voiceInput: true,\r\n    voiceOutput: true,\r\n  },\r\n  onReady() {\r\n    console.log('数字人就绪');\r\n  },\r\n});\r\n\r\navatar.speak('你好');\r\navatar.expand();\r\n```\r\n\r\n## 配置项\r\n\r\n### 必填\r\n\r\n| 名称 | 类型 | 说明 |\r\n|---|---|---|\r\n| `token` / `apiKey` | `string` | API Key,在 [Console](https://avataraisdk.com) 生成 |\r\n| `agentId` | `string` | 数字人 ID(留空时后端按 token 自动推断) |\r\n\r\n### 外观\r\n\r\n| 名称 | 类型 | 默认 | 说明 |\r\n|---|---|---|---|\r\n| `position` | `'bottom-right' \\| 'bottom-left' \\| 'top-right' \\| 'top-left'` | `bottom-right` | 气泡位置 |\r\n| `theme` | `'light' \\| 'dark' \\| 'auto'` | `light` | 主题 |\r\n| `primaryColor` | `string` | `#6366F1` | 主色调 |\r\n| `size` | `'compact' \\| 'normal' \\| 'large'` | `normal` | 对话框大小 |\r\n\r\n### 行为\r\n\r\n| 名称 | 类型 | 默认 | 说明 |\r\n|---|---|---|---|\r\n| `autoOpen` | `boolean` | `false` | 加载后自动展开 |\r\n| `autoOpenDelay` | `number` | `0` | 自动展开延迟(ms) |\r\n| `greeting` | `string` | — | 问候语 |\r\n| `voiceInput` | `boolean` | `true` | 是否允许麦克风输入 |\r\n| `voiceOutput` | `boolean` | `true` | 是否启用语音输出 |\r\n\r\n### 高级\r\n\r\n| 名称 | 类型 | 说明 |\r\n|---|---|---|\r\n| `llmMode` | `'managed' \\| 'external'` | `managed`(默认) 走我们的 LLM;`external` 用你自己的 LLM,通过事件回调拿用户输入 |\r\n| `chatPanel` | `'visible' \\| 'hidden'` | `hidden` 时只渲染 3D 数字人,你自己做对话框 UI |\r\n\r\n## 事件回调\r\n\r\n### React\r\n\r\n```jsx\r\n<AIAvatar\r\n  token=\"...\"\r\n  onReady={() => console.log('就绪')}\r\n  onSpeakStart={(req) => console.log('开始说话', req)}\r\n  onSpeakEnd={(resp) => console.log('说完了', resp)}\r\n  onError={(err) => console.error(err)}\r\n  onUserInput={(msg) => console.log('用户输入', msg)}\r\n/>\r\n```\r\n\r\n### Vue\r\n\r\n```vue\r\n<AIAvatar\r\n  token=\"...\"\r\n  @ready=\"onReady\"\r\n  @speak-start=\"onSpeakStart\"\r\n  @speak-end=\"onSpeakEnd\"\r\n  @error=\"onError\"\r\n  @user-input=\"onUserInput\"\r\n/>\r\n```\r\n\r\n## Imperative API\r\n\r\n通过 ref 拿到的实例支持:\r\n\r\n| 方法 | 作用 |\r\n|---|---|\r\n| `speak(text)` | 让数字人说一段文字(TTS) |\r\n| `lipsync(audio, text?)` | 用现成音频做口型同步 |\r\n| `replyText(text)` | external 模式:文本回复 |\r\n| `replyAudio(text, url)` | external 模式:你自己的音频回复 |\r\n| `expand()` / `collapse()` / `toggle()` | 展开/折叠对话框 |\r\n| `sendMessage(text)` | 替用户发送消息 |\r\n| `setLoading(loading)` | 显示/隐藏 typing 指示器 |\r\n| `reloadConfig()` | 重载配置 |\r\n\r\n## 仅类型导入\r\n\r\n```ts\r\nimport type { AvatarConfig, AvatarInstance } from '@ai-avatar/embed-sdk/types';\r\n```\r\n\r\n## 浏览器兼容\r\n\r\n支持所有现代浏览器(Chrome / Edge / Firefox / Safari 14+)。\r\n依赖 WebGL、`postMessage`、`<iframe allow=\"microphone\">`。\r\n\r\n## License\r\n\r\nMIT\r\n","readmeFilename":"README.md"}