import { VeltRecorderTool, VeltRecorderPlayer} from '@veltdev/react'

const SomeComponent = () => {
    return (
        <div>
            <VeltRecorderTool type='all' />
            <VeltRecorderTool type='audio' />
            <VeltRecorderTool type='video' />
            <VeltRecorderTool type='screen' />
            <VeltRecorderTool panelId="YOUR_PANEL_ID" />
            <VeltRecorderPlayer recorderId="YOUR_PANEL_ID"/>
            <VeltRecorderTool buttonLabel='Your Label' />
        </div>   
    )
}
export default SomeComponent;
  • React / Next.js

  • HTML

1

Recording Types

Sets the VeltRecorderTool recording mode.

Default: 'audio'

The VeltRecorderTool can be configured to record a user’s audio, video or screen.

To set the configuration mode, set the type attribute to one of the following:

  • all
  • audio
  • video
  • screen
<VeltRecorderTool type='all' />
<VeltRecorderTool type='audio' />
<VeltRecorderTool type='video' />
<VeltRecorderTool type='screen' />
2

Recorder Panel Id

Sets the panelId that the Recording will be played on.

You must also set the VeltRecorderPlayer recorderId to the same value as panelId for the recording to show up on it.

<VeltRecorderTool panelId="YOUR_PANEL_ID" />
<VeltRecorderPlayer recorderId="YOUR_PANEL_ID"/>
3

Button Label

Sets a custom label for the VeltRecorderTool.

<VeltRecorderTool buttonLabel="Your Label Text" />