@livekit/components-js-docs 0.0.2

package/generated-docs/react/focustoggleprops.tracksource.md

@@ -0,0 +1,9 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+## FocusToggleProps.trackSource property
+
+**Signature:**
+
+```typescript
+trackSource: Track.Source;
+```

package/generated-docs/react/gridlayoutprops.children.md

@@ -0,0 +1,9 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+## GridLayoutProps.children property
+
+**Signature:**
+
+```typescript
+children: React.ReactNode;
+```

package/generated-docs/react/gridlayoutprops.md

@@ -0,0 +1,20 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+## GridLayoutProps interface
+
+**Signature:**
+
+```typescript
+export interface GridLayoutProps extends React.HTMLAttributes<HTMLDivElement>, Pick<UseParticipantsOptions, 'updateOnlyOn'>
+```
+
+**Extends:** React.HTMLAttributes&lt;HTMLDivElement&gt;, Pick&lt;[UseParticipantsOptions](./react/useparticipantsoptions.md)<!-- -->, 'updateOnlyOn'&gt;
+
+{% partial file="p_usage.md" /%}
+
+## Properties
+
+| Property                                        | Type                                                                             | Description |
+| ----------------------------------------------- | -------------------------------------------------------------------------------- | ----------- |
+| [children](./react/gridlayoutprops.children.md) | React.ReactNode                                                                  |             |
+| [tracks](./react/gridlayoutprops.tracks.md)     | [TrackReferenceOrPlaceholder](./core/trackreferenceorplaceholder.md)<!-- -->\[\] |             |

package/generated-docs/react/gridlayoutprops.tracks.md

@@ -0,0 +1,9 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+## GridLayoutProps.tracks property
+
+**Signature:**
+
+```typescript
+tracks: TrackReferenceOrPlaceholder[];
+```

package/generated-docs/react/hook/prejoinprops.userlabel.md

@@ -0,0 +1,9 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+## PreJoinProps.userLabel property
+
+## Import
+
+```typescript
+import { userLabel } from '@livekit/components-react';
+```

package/generated-docs/react/hook/usechat.md

@@ -0,0 +1,15 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useChat (hook)
+
+## Import
+
+```typescript
+import { useChat } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+**Returns:**
+
+{ send: ((message: string) =&gt; Promise&lt;void&gt;) \| undefined; chatMessages: [ReceivedChatMessage](./core/receivedchatmessage.md)<!-- -->\[\]; isSending: boolean; }

package/generated-docs/react/hook/usechattoggle.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useChatToggle (hook)
+
+## Import
+
+```typescript
+import { useChatToggle } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                                | Description |
+| --------- | --------------------------------------------------- | ----------- |
+| { props } | [UseChatToggleProps](./react/usechattoggleprops.md) |             |
+
+**Returns:**
+
+{ mergedProps: React.ButtonHTMLAttributes&lt;HTMLButtonElement&gt; &amp; { className: string; onClick: () =&gt; void; 'aria-pressed': string; 'data-lk-unread-msgs': string; }; }

package/generated-docs/react/hook/useclearpinbutton.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useClearPinButton (hook)
+
+## Import
+
+```typescript
+import { useClearPinButton } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                                  | Description |
+| --------- | ----------------------------------------------------- | ----------- |
+| props     | [ClearPinButtonProps](./react/clearpinbuttonprops.md) |             |
+
+**Returns:**
+
+{ buttonProps: [ClearPinButtonProps](./react/clearpinbuttonprops.md) &amp; { className: string; disabled: boolean; onClick: () =&gt; void; }; }

package/generated-docs/react/hook/useconnectionqualityindicator.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useConnectionQualityIndicator (hook)
+
+## Import
+
+```typescript
+import { useConnectionQualityIndicator } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                                                              | Description  |
+| --------- | --------------------------------------------------------------------------------- | ------------ |
+| options   | [ConnectionQualityIndicatorOptions](./react/connectionqualityindicatoroptions.md) | _(Optional)_ |
+
+**Returns:**
+
+{ className: "lk-rotate" \| "lk-audio-conference" \| "lk-audio-conference-stage" \| "lk-audio-container" \| "lk-button" \| "lk-button-group" \| "lk-button-group-container" \| "lk-camera-off-note" \| "lk-chat" \| "lk-chat-entry" \| "lk-chat-form" \| "lk-chat-form-input" \| "lk-chat-messages" \| "lk-control-bar" \| "lk-focus-layout-wrapper" \| "lk-form-control" \| "lk-grid-layout-wrapper" \| "lk-join-button" \| "lk-list" \| "lk-message-body" \| "lk-meta-data" \| "lk-participant-name" \| "lk-prejoin" \| "lk-timestamp" \| "lk-username-container" \| "lk-video-conference" \| "lk-video-conference-inner" \| "lk-video-container" \| "lk-audio-visualizer" \| "lk-button-group-menu" \| "lk-button-menu" \| "lk-carousel" \| "lk-chat-toggle" \| "lk-connection-quality" \| "lk-device-menu" \| "lk-device-menu-heading" \| "lk-disconnect-button" \| "lk-focus-layout" \| "lk-focus-toggle-button" \| "lk-focused-participant" \| "lk-grid-layout" \| "lk-media-device-select" \| "lk-pagination-control" \| "lk-pagination-count" \| "lk-pagination-indicator" \| "lk-participant-media-audio" \| "lk-participant-media-video" \| "lk-participant-metadata" \| "lk-participant-metadata-item" \| "lk-participant-placeholder" \| "lk-participant-tile" \| "lk-pip-track" \| "lk-room-container" \| "lk-spinner" \| "lk-start-audio-button" \| "lk-toast" \| "lk-track-muted-indicator-camera" \| "lk-track-muted-indicator-microphone"; quality: ConnectionQuality; }

package/generated-docs/react/hook/useconnectionstate.md

@@ -0,0 +1,29 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useConnectionState (hook)
+
+The `useConnectionState` hook allows you to simply implement your own `ConnectionState` component.
+
+## Import
+
+```typescript
+import { useConnectionState } from '@livekit/components-react';
+```
+
+## Usage
+
+```tsx
+const connectionState = useConnectionState(room);
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type | Description  |
+| --------- | ---- | ------------ |
+| room      | Room | _(Optional)_ |
+
+**Returns:**
+
+import("livekit-client").ConnectionState

package/generated-docs/react/hook/usecreatelayoutcontext.md

@@ -0,0 +1,15 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useCreateLayoutContext (hook)
+
+## Import
+
+```typescript
+import { useCreateLayoutContext } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+**Returns:**
+
+[LayoutContextType](./react/layoutcontexttype.md)

package/generated-docs/react/hook/usedatachannel.md

@@ -0,0 +1,22 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useDataChannel (hook)
+
+## Import
+
+```typescript
+import { useDataChannel } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                                                                    | Description  |
+| --------- | --------------------------------------------------------------------------------------- | ------------ |
+| topic     | T                                                                                       |              |
+| onMessage | (msg: [ReceivedDataMessage](./core/receiveddatamessage.md)<!-- -->&lt;T&gt;) =&gt; void | _(Optional)_ |
+
+**Returns:**
+
+UseDataChannelReturnType&lt;T&gt;

package/generated-docs/react/hook/usedatachannel_1.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useDataChannel (hook)
+
+## Import
+
+```typescript
+import { useDataChannel } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                                                           | Description  |
+| --------- | ------------------------------------------------------------------------------ | ------------ |
+| onMessage | (msg: [ReceivedDataMessage](./core/receiveddatamessage.md)<!-- -->) =&gt; void | _(Optional)_ |
+
+**Returns:**
+
+UseDataChannelReturnType

package/generated-docs/react/hook/usedisconnectbutton.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useDisconnectButton (hook)
+
+## Import
+
+```typescript
+import { useDisconnectButton } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                                      | Description |
+| --------- | --------------------------------------------------------- | ----------- |
+| props     | [DisconnectButtonProps](./react/disconnectbuttonprops.md) |             |
+
+**Returns:**
+
+{ buttonProps: [DisconnectButtonProps](./react/disconnectbuttonprops.md) &amp; { className: string; onClick: () =&gt; void; disabled: boolean; }; }

package/generated-docs/react/hook/useensurecreatelayoutcontext.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useEnsureCreateLayoutContext (hook)
+
+## Import
+
+```typescript
+import { useEnsureCreateLayoutContext } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter     | Type                                              | Description  |
+| ------------- | ------------------------------------------------- | ------------ |
+| layoutContext | [LayoutContextType](./react/layoutcontexttype.md) | _(Optional)_ |
+
+**Returns:**
+
+[LayoutContextType](./react/layoutcontexttype.md)

package/generated-docs/react/hook/useensurelayoutcontext.md

@@ -0,0 +1,23 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useEnsureLayoutContext (hook)
+
+Ensures that a layout context is provided, either via context or explicitly as a parameter. If not inside a `LayoutContext` and no layout context is provided, an error is thrown.
+
+## Import
+
+```typescript
+import { useEnsureLayoutContext } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter     | Type                                              | Description  |
+| ------------- | ------------------------------------------------- | ------------ |
+| layoutContext | [LayoutContextType](./react/layoutcontexttype.md) | _(Optional)_ |
+
+**Returns:**
+
+[LayoutContextType](./react/layoutcontexttype.md)

package/generated-docs/react/hook/useensureparticipant.md

@@ -0,0 +1,23 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useEnsureParticipant (hook)
+
+Ensures that a participant is provided, either via context or explicitly as a parameter. If not inside a `ParticipantContext` and no participant is provided, an error is thrown.
+
+## Import
+
+```typescript
+import { useEnsureParticipant } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter   | Type        | Description  |
+| ----------- | ----------- | ------------ |
+| participant | Participant | _(Optional)_ |
+
+**Returns:**
+
+Participant

package/generated-docs/react/hook/useensureroom.md

@@ -0,0 +1,23 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useEnsureRoom (hook)
+
+Ensures that a room is provided, either via context or explicitly as a parameter. If no room is provided, an error is thrown.
+
+## Import
+
+```typescript
+import { useEnsureRoom } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type | Description  |
+| --------- | ---- | ------------ |
+| room      | Room | _(Optional)_ |
+
+**Returns:**
+
+Room

package/generated-docs/react/hook/useensuretrackreference.md

@@ -0,0 +1,23 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useEnsureTrackReference (hook)
+
+Ensures that a track reference is provided, either via context or explicitly as a parameter. If not inside a `TrackContext` and no track reference is provided, an error is thrown.
+
+## Import
+
+```typescript
+import { useEnsureTrackReference } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                                                 | Description  |
+| --------- | -------------------------------------------------------------------- | ------------ |
+| track     | [TrackReferenceOrPlaceholder](./core/trackreferenceorplaceholder.md) | _(Optional)_ |
+
+**Returns:**
+
+[TrackReferenceOrPlaceholder](./core/trackreferenceorplaceholder.md)

package/generated-docs/react/hook/usefocustoggle.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useFocusToggle (hook)
+
+## Import
+
+```typescript
+import { useFocusToggle } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter                           | Type                                                  | Description |
+| ----------------------------------- | ----------------------------------------------------- | ----------- |
+| { trackSource, participant, props } | [UseFocusToggleProps](./react/usefocustoggleprops.md) |             |
+
+**Returns:**
+
+{ mergedProps: React.ButtonHTMLAttributes&lt;HTMLButtonElement&gt; &amp; { className: string; onClick: (event: React.MouseEvent&lt;HTMLButtonElement, MouseEvent&gt;) =&gt; void; }; inFocus: boolean; }

package/generated-docs/react/hook/usegridlayout.md

@@ -0,0 +1,24 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useGridLayout (hook)
+
+The useGridLayout hook tries to select the best layout to fit all tiles. If the available screen space is not enough, it will reduce the number of maximum visible tiles and select a layout that still works visually within the given limitations. As the order of tiles changes over time, the hook tries to keep visual updates to a minimum while trying to display important tiles such as speaking participants or screen shares.
+
+## Import
+
+```typescript
+import { useGridLayout } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter   | Type                                  | Description |
+| ----------- | ------------------------------------- | ----------- |
+| gridElement | React.RefObject&lt;HTMLDivElement&gt; |             |
+| trackCount  | number                                |             |
+
+**Returns:**
+
+{ layout: [GridLayoutDefinition](./core/gridlayoutdefinition.md)<!-- -->; }

package/generated-docs/react/hook/useismuted.md

@@ -0,0 +1,22 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useIsMuted (hook)
+
+## Import
+
+```typescript
+import { useIsMuted } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                              | Description  |
+| --------- | ------------------------------------------------- | ------------ |
+| source    | Track.Source                                      |              |
+| options   | [UseIsMutedOptions](./react/useismutedoptions.md) | _(Optional)_ |
+
+**Returns:**
+
+boolean

package/generated-docs/react/hook/useisspeaking.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useIsSpeaking (hook)
+
+## Import
+
+```typescript
+import { useIsSpeaking } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter   | Type        | Description  |
+| ----------- | ----------- | ------------ |
+| participant | Participant | _(Optional)_ |
+
+**Returns:**
+
+boolean

package/generated-docs/react/hook/uselayoutcontext.md

@@ -0,0 +1,17 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useLayoutContext (hook)
+
+Ensures that a layout context is provided via context. If no layout context is provided, an error is thrown.
+
+## Import
+
+```typescript
+import { useLayoutContext } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+**Returns:**
+
+[LayoutContextType](./react/layoutcontexttype.md)

package/generated-docs/react/hook/uselivekitroom.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useLiveKitRoom (hook)
+
+## Import
+
+```typescript
+import { useLiveKitRoom } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                            | Description |
+| --------- | ----------------------------------------------- | ----------- |
+| props     | [LiveKitRoomProps](./react/livekitroomprops.md) |             |
+
+**Returns:**
+
+{ room: Room \| undefined; htmlProps: HTMLAttributes&lt;T&gt;; }

package/generated-docs/react/hook/uselocalparticipant.md

@@ -0,0 +1,23 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useLocalParticipant (hook)
+
+The useLocalParticipant hook the state of the local participant.
+
+## Import
+
+```typescript
+import { useLocalParticipant } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                                                                | Description  |
+| --------- | ------------------------------------------------------------------- | ------------ |
+| options   | [UseLocalParticipantOptions](./react/uselocalparticipantoptions.md) | _(Optional)_ |
+
+**Returns:**
+
+{ isMicrophoneEnabled: boolean; isScreenShareEnabled: boolean; isCameraEnabled: boolean; microphoneTrack: TrackPublication \| undefined; cameraTrack: TrackPublication \| undefined; localParticipant: LocalParticipant; }

package/generated-docs/react/hook/uselocalparticipantpermissions.md

@@ -0,0 +1,15 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useLocalParticipantPermissions (hook)
+
+## Import
+
+```typescript
+import { useLocalParticipantPermissions } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+**Returns:**
+
+import("livekit-client/dist/src/proto/livekit_models").ParticipantPermission \| undefined

package/generated-docs/react/hook/usemaybelayoutcontext.md

@@ -0,0 +1,17 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useMaybeLayoutContext (hook)
+
+Returns a layout context from the `LayoutContext` if it exists, otherwise `undefined`<!-- -->.
+
+## Import
+
+```typescript
+import { useMaybeLayoutContext } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+**Returns:**
+
+[LayoutContextType](./react/layoutcontexttype.md) \| undefined

package/generated-docs/react/hook/usemaybeparticipantcontext.md

@@ -0,0 +1,17 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useMaybeParticipantContext (hook)
+
+Returns a participant from the `ParticipantContext` if it exists, otherwise `undefined`<!-- -->.
+
+## Import
+
+```typescript
+import { useMaybeParticipantContext } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+**Returns:**
+
+Participant \| undefined

package/generated-docs/react/hook/usemayberoomcontext.md

@@ -0,0 +1,17 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useMaybeRoomContext (hook)
+
+Returns the room context if it exists, otherwise undefined.
+
+## Import
+
+```typescript
+import { useMaybeRoomContext } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+**Returns:**
+
+Room \| undefined

package/generated-docs/react/hook/usemaybetrackcontext.md

@@ -0,0 +1,17 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useMaybeTrackContext (hook)
+
+Returns a track reference from the `TrackContext` if it exists, otherwise `undefined`<!-- -->.
+
+## Import
+
+```typescript
+import { useMaybeTrackContext } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+**Returns:**
+
+[TrackReferenceOrPlaceholder](./core/trackreferenceorplaceholder.md) \| undefined

package/generated-docs/react/hook/usemediadevices.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# useMediaDevices (hook)
+
+## Import
+
+```typescript
+import { useMediaDevices } from '@livekit/components-react';
+```
+
+{% partial file="p_usage.md" /%}
+
+## Parameters
+
+| Parameter | Type                       | Description |
+| --------- | -------------------------- | ----------- |
+| { kind }  | { kind: MediaDeviceKind; } |             |
+
+**Returns:**
+
+MediaDeviceInfo\[\]