@mxmweb/auplayer

React 音频播放相关能力集合：通用 AudioPlayer、音乐条 MusicPlayerAdapter、录音 AudioRecorderAdapter，以及面向智能问答 / 语音消息的 VoicePlayerAdapter（波形 + 时间轴 + 标注 + 控制区）。

说明（npm 使用者）

• 在业务项目中请通过 npm 安装 @mxmweb/auplayer；集成时以 npm 上该版本的 peerDependencies 与 exports 为准。
• 若你在公开信息中看到源码目录带有 private: true，仅表示组织内的发版/workspace 配置，不影响使用已发布到 npm 的版本。

安装与依赖

消费者项目建议一次性安装 peer（版本以 npm 包声明为准）：

pnpm add @mxmweb/auplayer @mxmweb/zui react react-dom styled-components

Peer 依赖（与当前 package.json 中 peerDependencies 对齐）：

• @mxmweb/zui：^1.3.x（与语音条等 UI 配套）
• react / react-dom：≥ 18 < 20
• styled-components：^6.1.19

样式入口（与 exports 中的 ./style.css 一致）：

import '@mxmweb/auplayer/style.css';

入口导出

import {
  AudioPlayer,
  AudioRecorderAdapter,
  MusicPlayerAdapter,
  VoicePlayerAdapter,
  type AudioPlayerProps,
  type AudioPlayerRef,
  type VoicePlayerAdapterProps,
  type AudioTimelineSegment,
} from '@mxmweb/auplayer';

VoicePlayerAdapter（语音条）

适用于消息气泡、抽屉、详情页内嵌语音播放。详细 API、事件表与标注说明见：

doc_assets/接口/VoicePlayerAdapter.md

快速用法

<VoicePlayerAdapter
  src={audioUrl}
  title="客户留言"
  annotations={[
    { id: '1', start: 5, end: 12, label: '报价', color: 'rgba(78,110,242,0.85)' },
  ]}
  annotationAutoplay
  audioCrossOrigin="anonymous"
  eventEmit={(name, data) => {
    /* 埋点 / 状态同步 */
  }}
/>

其他组件

• AudioPlayer：通用播放器 + 可选录音能力，见 src/core/index.tsx 与导出类型 AudioPlayerProps。
• MusicPlayerAdapter / AudioRecorderAdapter：场景封装，按需从 lib_enter 引入。

许可证

以仓库根目录 LICENSE 为准。