Concepts
Async Collaboration
- Comments
- In-app Notifications
- Recorder
- Inline Reactions
- Arrows
Realtime Collaboration
- Presence
- Cursors
- Live Selection
- Huddle
- Single Editor Mode
Recorder
Media Source Settings
Media source settings component.
We recommend that you familiarize yourselves with UI Customization Concepts before attempting to modify any components.
Overview
<VeltWireframe>
<VeltMediaSourceSettingsWireframe>
<VeltMediaSourceSettingsWireframe.Audio />
<VeltMediaSourceSettingsWireframe.Video />
</VeltMediaSourceSettingsWireframe>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe>
<VeltMediaSourceSettingsWireframe.Audio />
<VeltMediaSourceSettingsWireframe.Video />
</VeltMediaSourceSettingsWireframe>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-wireframe>
<velt-media-source-settings-audio-wireframe></velt-media-source-settings-audio-wireframe>
<velt-media-source-settings-video-wireframe></velt-media-source-settings-video-wireframe>
</velt-media-source-settings-wireframe>
</velt-wireframe>
Audio
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio>
<VeltMediaSourceSettingsWireframe.Audio.ToggleIcon />
<VeltMediaSourceSettingsWireframe.Audio.SelectedLabel />
<VeltMediaSourceSettingsWireframe.Audio.Divider />
<VeltMediaSourceSettingsWireframe.Audio.Options />
</VeltMediaSourceSettingsWireframe.Audio>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio>
<VeltMediaSourceSettingsWireframe.Audio.ToggleIcon />
<VeltMediaSourceSettingsWireframe.Audio.SelectedLabel />
<VeltMediaSourceSettingsWireframe.Audio.Divider />
<VeltMediaSourceSettingsWireframe.Audio.Options />
</VeltMediaSourceSettingsWireframe.Audio>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-audio-wireframe>
<velt-media-source-settings-toggle-icon-wireframe></velt-media-source-settings-toggle-icon-wireframe>
<velt-media-source-settings-selected-label-wireframe></velt-media-source-settings-selected-label-wireframe>
<velt-media-source-settings-divider-wireframe></velt-media-source-settings-divider-wireframe>
<velt-media-source-settings-options-wireframe></velt-media-source-settings-options-wireframe>
</velt-media-source-settings-audio-wireframe>
</velt-wireframe>
ToggleIcon
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.ToggleIcon>
<VeltMediaSourceSettingsWireframe.Audio.ToggleIcon.Open />
<VeltMediaSourceSettingsWireframe.Audio.ToggleIcon.Close />
</VeltMediaSourceSettingsWireframe.Audio.ToggleIcon>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.ToggleIcon>
<VeltMediaSourceSettingsWireframe.Audio.ToggleIcon.Open />
<VeltMediaSourceSettingsWireframe.Audio.ToggleIcon.Close />
</VeltMediaSourceSettingsWireframe.Audio.ToggleIcon>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-toggle-icon-wireframe>
<velt-media-source-settings-toggle-icon-open-wireframe></velt-media-source-settings-toggle-icon-open-wireframe>
<velt-media-source-settings-toggle-icon-close-wireframe></velt-media-source-settings-toggle-icon-close-wireframe>
</velt-media-source-settings-toggle-icon-wireframe>
</velt-wireframe>
SelectedLabel
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.SelectedLabel />
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.SelectedLabel />
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-selected-label-wireframe></velt-media-source-settings-selected-label-wireframe>
</velt-wireframe>
Divider
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.Divider />
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.Divider />
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-divider-wireframe></velt-media-source-settings-divider-wireframe>
</velt-wireframe>
Options
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.Options>
<VeltMediaSourceSettingsWireframe.Audio.Options.Item />
</VeltMediaSourceSettingsWireframe.Audio.Options>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.Options>
<VeltMediaSourceSettingsWireframe.Audio.Options.Item />
</VeltMediaSourceSettingsWireframe.Audio.Options>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-options-wireframe>
<velt-media-source-settings-options-item-wireframe></velt-media-source-settings-options-item-wireframe>
</velt-media-source-settings-options-wireframe>
</velt-wireframe>
Item
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.Options.Item>
<VeltMediaSourceSettingsWireframe.Audio.Options.Item.Icon />
<VeltMediaSourceSettingsWireframe.Audio.Options.Item.Label />
</VeltMediaSourceSettingsWireframe.Audio.Options.Item>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Audio.Options.Item>
<VeltMediaSourceSettingsWireframe.Audio.Options.Item.Icon />
<VeltMediaSourceSettingsWireframe.Audio.Options.Item.Label />
</VeltMediaSourceSettingsWireframe.Audio.Options.Item>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-options-item-wireframe>
<velt-media-source-settings-options-item-icon-wireframe></velt-media-source-settings-options-item-icon-wireframe>
<velt-media-source-settings-options-item-label-wireframe></velt-media-source-settings-options-item-label-wireframe>
</velt-media-source-settings-options-item-wireframe>
</velt-wireframe>
Video
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video>
<VeltMediaSourceSettingsWireframe.Video.ToggleIcon />
<VeltMediaSourceSettingsWireframe.Video.SelectedLabel />
<VeltMediaSourceSettingsWireframe.Video.Divider />
<VeltMediaSourceSettingsWireframe.Video.Options />
</VeltMediaSourceSettingsWireframe.Video>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video>
<VeltMediaSourceSettingsWireframe.Video.ToggleIcon />
<VeltMediaSourceSettingsWireframe.Video.SelectedLabel />
<VeltMediaSourceSettingsWireframe.Video.Divider />
<VeltMediaSourceSettingsWireframe.Video.Options />
</VeltMediaSourceSettingsWireframe.Video>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-video-wireframe>
<velt-media-source-settings-toggle-icon-wireframe></velt-media-source-settings-toggle-icon-wireframe>
<velt-media-source-settings-selected-label-wireframe></velt-media-source-settings-selected-label-wireframe>
<velt-media-source-settings-divider-wireframe></velt-media-source-settings-divider-wireframe>
<velt-media-source-settings-options-wireframe></velt-media-source-settings-options-wireframe>
</velt-media-source-settings-video-wireframe>
</velt-wireframe>
ToggleIcon
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.ToggleIcon>
<VeltMediaSourceSettingsWireframe.Video.ToggleIcon.Open />
<VeltMediaSourceSettingsWireframe.Video.ToggleIcon.Close />
</VeltMediaSourceSettingsWireframe.Video.ToggleIcon>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.ToggleIcon>
<VeltMediaSourceSettingsWireframe.Video.ToggleIcon.Open />
<VeltMediaSourceSettingsWireframe.Video.ToggleIcon.Close />
</VeltMediaSourceSettingsWireframe.Video.ToggleIcon>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-toggle-icon-wireframe>
<velt-media-source-settings-toggle-icon-open-wireframe></velt-media-source-settings-toggle-icon-open-wireframe>
<velt-media-source-settings-toggle-icon-close-wireframe></velt-media-source-settings-toggle-icon-close-wireframe>
</velt-media-source-settings-toggle-icon-wireframe>
</velt-wireframe>
SelectedLabel
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.SelectedLabel />
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.SelectedLabel />
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-selected-label-wireframe></velt-media-source-settings-selected-label-wireframe>
</velt-wireframe>
Divider
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.Divider />
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.Divider />
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-divider-wireframe></velt-media-source-settings-divider-wireframe>
</velt-wireframe>
Options
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.Options>
<VeltMediaSourceSettingsWireframe.Video.Options.Item />
</VeltMediaSourceSettingsWireframe.Video.Options>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.Options>
<VeltMediaSourceSettingsWireframe.Video.Options.Item />
</VeltMediaSourceSettingsWireframe.Video.Options>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-options-wireframe>
<velt-media-source-settings-options-item-wireframe></velt-media-source-settings-options-item-wireframe>
</velt-media-source-settings-options-wireframe>
</velt-wireframe>
Item
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.Options.Item>
<VeltMediaSourceSettingsWireframe.Video.Options.Item.Icon />
<VeltMediaSourceSettingsWireframe.Video.Options.Item.Label />
</VeltMediaSourceSettingsWireframe.Video.Options.Item>
</VeltWireframe>
<VeltWireframe>
<VeltMediaSourceSettingsWireframe.Video.Options.Item>
<VeltMediaSourceSettingsWireframe.Video.Options.Item.Icon />
<VeltMediaSourceSettingsWireframe.Video.Options.Item.Label />
</VeltMediaSourceSettingsWireframe.Video.Options.Item>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-media-source-settings-options-item-wireframe>
<velt-media-source-settings-options-item-icon-wireframe></velt-media-source-settings-options-item-icon-wireframe>
<velt-media-source-settings-options-item-label-wireframe></velt-media-source-settings-options-item-label-wireframe>
</velt-media-source-settings-options-item-wireframe>
</velt-wireframe>
Was this page helpful?
Assistant
Responses are generated using AI and may contain mistakes.