@livekit/components-js-docs 0.1.18 → 0.1.19

package/generated-docs/react/audiotrack.md

@@ -0,0 +1,30 @@
+---
+{
+  "title": "AudioTrack variable",
+  "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/participant/AudioTrack.tsx"
+}
+---
+
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# AudioTrack variable
+
+The AudioTrack component is responsible for rendering participant audio tracks. This component must have access to the participant's context, or alternatively pass it a `Participant` as a property.
+
+**Signature:**
+
+```typescript
+AudioTrack: React.ForwardRefExoticComponent<
+  AudioTrackProps & React.RefAttributes<HTMLAudioElement>
+>;
+```
+
+## Usage
+
+```tsx
+<ParticipantTile>
+  <AudioTrack trackRef={trackRef} />
+</ParticipantTile>
+```
+
+{% partial file="p_usage.md" variables={exampleCount: 1} /%}

package/generated-docs/react/{component/audiovisualizer.md → audiovisualizer.md}

@@ -1,20 +1,22 @@
 ---
 {
-  "title": "AudioVisualizer",
+  "title": "AudioVisualizer variable",
   "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/participant/AudioVisualizer.tsx"
 }
 ---
 
 <!-- Do not edit this file. It is automatically generated by API Documenter. -->
 
-# AudioVisualizer
+# AudioVisualizer variable
 
 The AudioVisualizer component is used to visualize the audio volume of a given audio track.
 
-## Import
+**Signature:**
 
 ```typescript
-import { AudioVisualizer } from "@livekit/components-react";
+AudioVisualizer: React.ForwardRefExoticComponent<
+  AudioVisualizerProps & React.RefAttributes<SVGSVGElement>
+>;
 ```
 
 ## Remarks
@@ -28,10 +30,3 @@ Requires a `TrackReferenceOrPlaceholder` to be provided either as a property or
 ```
 
 {% partial file="p_usage.md" variables={exampleCount: 1} /%}
-
-## Properties
-
-{% parameter name="trackRef" type="TrackReference" optional=true %}
-_(Optional)_
-
-{% /parameter %}

package/generated-docs/react/chatentry.md

@@ -0,0 +1,28 @@
+---
+{
+  "title": "ChatEntry variable",
+  "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/ChatEntry.tsx"
+}
+---
+
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+# ChatEntry variable
+
+The `ChatEntry` component holds and displays one chat message.
+
+**Signature:**
+
+```typescript
+ChatEntry: React.ForwardRefExoticComponent<ChatEntryProps & React.RefAttributes<HTMLLIElement>>;
+```
+
+## Usage
+
+```tsx
+<Chat>
+  <ChatEntry />
+</Chat>
+```
+
+{% partial file="p_usage.md" variables={exampleCount: 1} /%}

package/generated-docs/react/{component/chattoggle.md → chattoggle.md}

@@ -1,20 +1,22 @@
 ---
 {
-  "title": "ChatToggle",
+  "title": "ChatToggle variable",
   "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/controls/ChatToggle.tsx"
 }
 ---
 
 <!-- Do not edit this file. It is automatically generated by API Documenter. -->
 
-# ChatToggle
+# ChatToggle variable
 
 The `ChatToggle` component is a button that toggles the visibility of the `Chat` component.
 
-## Import
+**Signature:**
 
 ```typescript
-import { ChatToggle } from "@livekit/components-react";
+ChatToggle: React.ForwardRefExoticComponent<
+  ChatToggleProps & React.RefAttributes<HTMLButtonElement>
+>;
 ```
 
 ## Remarks

package/generated-docs/react/{component/clearpinbutton.md → clearpinbutton.md}

@@ -1,20 +1,22 @@
 ---
 {
-  "title": "ClearPinButton",
+  "title": "ClearPinButton variable",
   "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/controls/ClearPinButton.tsx"
 }
 ---
 
 <!-- Do not edit this file. It is automatically generated by API Documenter. -->
 
-# ClearPinButton
+# ClearPinButton variable
 
 The `ClearPinButton` is a basic html button with the added ability to signal the `LayoutContext` that it should display the grid view again.
 
-## Import
+**Signature:**
 
 ```typescript
-import { ClearPinButton } from "@livekit/components-react";
+ClearPinButton: React.ForwardRefExoticComponent<
+  ClearPinButtonProps & React.RefAttributes<HTMLButtonElement>
+>;
 ```
 
 ## Remarks

package/generated-docs/react/{component/connectionqualityindicator.md → connectionqualityindicator.md}

@@ -1,20 +1,22 @@
 ---
 {
-  "title": "ConnectionQualityIndicator",
+  "title": "ConnectionQualityIndicator variable",
   "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/participant/ConnectionQualityIndicator.tsx"
 }
 ---
 
 <!-- Do not edit this file. It is automatically generated by API Documenter. -->
 
-# ConnectionQualityIndicator
+# ConnectionQualityIndicator variable
 
 The `ConnectionQualityIndicator` shows the individual connection quality of a participant.
 
-## Import
+**Signature:**
 
 ```typescript
-import { ConnectionQualityIndicator } from "@livekit/components-react";
+ConnectionQualityIndicator: React.ForwardRefExoticComponent<
+  ConnectionQualityIndicatorProps & React.RefAttributes<HTMLDivElement>
+>;
 ```
 
 ## Usage

package/generated-docs/react/{component/connectionstate.md → connectionstate.md}

@@ -1,20 +1,22 @@
 ---
 {
-  "title": "ConnectionState",
+  "title": "ConnectionState variable",
   "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/ConnectionState.tsx"
 }
 ---
 
 <!-- Do not edit this file. It is automatically generated by API Documenter. -->
 
-# ConnectionState
+# ConnectionState variable
 
 The `ConnectionState` component displays the connection status of the room as strings (`"connected" | "connecting" | "disconnected" | "reconnecting"`<!-- -->).
 
-## Import
+**Signature:**
 
 ```typescript
-import { ConnectionState } from "@livekit/components-react";
+ConnectionState: React.ForwardRefExoticComponent<
+  ConnectionStatusProps & React.RefAttributes<HTMLDivElement>
+>;
 ```
 
 ## Usage
@@ -26,10 +28,3 @@ import { ConnectionState } from "@livekit/components-react";
 ```
 
 {% partial file="p_usage.md" variables={exampleCount: 1} /%}
-
-## Properties
-
-{% parameter name="room" type="Room" optional=true %}
-_(Optional)_ The room from which the connection status should be displayed.
-
-{% /parameter %}

package/generated-docs/react/{component/disconnectbutton.md → disconnectbutton.md}

@@ -1,20 +1,22 @@
 ---
 {
-  "title": "DisconnectButton",
+  "title": "DisconnectButton variable",
   "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/controls/DisconnectButton.tsx"
 }
 ---
 
 <!-- Do not edit this file. It is automatically generated by API Documenter. -->
 
-# DisconnectButton
+# DisconnectButton variable
 
 The `DisconnectButton` is a basic html button with the added ability to disconnect from a LiveKit room. Normally this is the big red button that allows end users to leave the video or audio call.
 
-## Import
+**Signature:**
 
 ```typescript
-import { DisconnectButton } from "@livekit/components-react";
+DisconnectButton: React.ForwardRefExoticComponent<
+  DisconnectButtonProps & React.RefAttributes<HTMLButtonElement>
+>;
 ```
 
 ## Usage
@@ -26,10 +28,3 @@ import { DisconnectButton } from "@livekit/components-react";
 ```
 
 {% partial file="p_usage.md" variables={exampleCount: 1} /%}
-
-## Properties
-
-{% parameter name="stopTracks" type="boolean" optional=true %}
-_(Optional)_
-
-{% /parameter %}

package/generated-docs/react/{component/focustoggle.md → focustoggle.md}

@@ -1,20 +1,22 @@
 ---
 {
-  "title": "FocusToggle",
+  "title": "FocusToggle variable",
   "linkToSource": "https://github.com/livekit/components-js/blob/main/packages/react/src/components/controls/FocusToggle.tsx"
 }
 ---
 
 <!-- Do not edit this file. It is automatically generated by API Documenter. -->
 
-# FocusToggle
+# FocusToggle variable
 
 The `FocusToggle` puts the `ParticipantTile` in focus or removes it from focus.
 
-## Import
+**Signature:**
 
 ```typescript
-import { FocusToggle } from "@livekit/components-react";
+FocusToggle: React.ForwardRefExoticComponent<
+  FocusToggleProps & React.RefAttributes<HTMLButtonElement>
+>;
 ```
 
 ## Remarks
@@ -30,10 +32,3 @@ This component needs to live inside `LayoutContext` to work properly.
 ```
 
 {% partial file="p_usage.md" variables={exampleCount: 1} /%}
-
-## Properties
-
-{% parameter name="trackRef" type="TrackReferenceOrPlaceholder" optional=true %}
-_(Optional)_
-
-{% /parameter %}

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

@@ -9,7 +9,7 @@
 
 # useClearPinButton
 
-The `useClearPinButton` hook provides props for the [ClearPinButton()](./react/component/clearpinbutton.md) or your custom implementation of it component. It adds the `onClick` handler to signal the `LayoutContext` that the tile in focus should be cleared.
+The `useClearPinButton` hook provides props for the [ClearPinButton](./react/clearpinbutton.md) or your custom implementation of it component. It adds the `onClick` handler to signal the `LayoutContext` that the tile in focus should be cleared.
 
 ## Import