https://github.com/vue-a11y/voicecapture-vue
https://github.com/vue-a11y/voicecapture-vue
Last synced: 16 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/vue-a11y/voicecapture-vue
- Owner: vue-a11y
- Created: 2024-10-25T22:12:47.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2025-01-26T23:23:41.000Z (4 months ago)
- Last Synced: 2025-04-26T10:32:26.285Z (24 days ago)
- Language: Vue
- Homepage: https://voicecapture-vue.web.app/
- Size: 729 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# VoiceCapture Vue
`VoiceCapture Vue` is a Vue component for real-time voice capture and speech transcription. This component leverages the Web Speech API for speech recognition and provides an interactive UI.
## Installation
Install `voicecapture-vue` via npm:
```bash
npm install voicecapture-vue
```
## Basic Usage
### Script Setup
```javascript
import { ref } from 'vue';
import VoiceCapture from 'voicecapture-vue';
const isVoiceCaptureActive = ref(false);
const selectedLang = ref('en');
const selectedMode = ref('fullscreen');
const transcript = ref('');
function handleTranscript(text) {
transcript.value = text;
}
function handleStatusChange(status) {
isVoiceCaptureActive.value = status;
}
```
### Template Example
Use the component in your template with language and mode options:
```html
```
### Props
| Prop | Type | Default | Description |
|------------|---------|------------|----------------------------------------------------------------------------------------------|
| `status` | Boolean | `false` | Toggles the voice capture on/off. Set to `true` to activate voice recognition. |
| `lang` | String | `"en"` | Specifies the language for speech recognition (e.g., `"pt"` for Portuguese). |
| `mode` | String | `"fullscrenn"` | Defines the display mode: `"float"` for inline, `"fullscreen"` for full-screen. |
| `clipboard`| Boolean | `false` | If `true`, copies the final transcript text to the clipboard automatically. |
### Events
| Event | Payload | Description |
|--------------------|-------------|-------------------------------------------------------------------------------------------------|
| `@voiceTranscript` | `String` | Emitted with the transcription generated from the user's speech. |
| `@onStatus` | `Boolean` | Emitted when the voice capture status changes (active/inactive). |