Start Audio Button | LiveKit Documentation

Usage

A button will be rendered below if audio playback is blocked.

Code

'use client';

import { useSession } from '@livekit/components-react';
import { AgentSessionProvider } from '@/components/agents-ui/agent-session-provider';
import { StartAudioButton } from '@/components/agents-ui/start-audio-button';

const TOKEN_SOURCE = TokenSource.sandboxTokenServer(
  process.env.MY_LK_SANDBOX_TOKEN_SERVER_ID
);

export function Demo() {
  const session = useSession(TOKEN_SOURCE);

  return (
    <AgentSessionProvider session={session}>
      <StartAudioButton />
    </AgentSessionProvider>
  );
}

Features

Displays a button for starting the agent session's audio track when the browser blocks audio playback

Installation

pnpm dlx shadcn@latest add @agents-ui/start-audio-button

Props

Prop name	Type	Default
size?	enum	default
variant?	enum	default
room?	Room	–
label	string	–
ref?	Ref<HTMLButtonElement>	–
...props?	ComponentProps<'button'>