open-index/open-npm huggingface dataset:
npm package: @onlive.ai/meet
Description: A web components package for video conferencing based on LiveKit, built with Lit Element. Provides reusable components to create high-quality video conferencing experiences.
Latest version: 0.0.40

# @onlive.ai/meet

A web components package for video conferencing based on LiveKit, built with Lit Element. Provides reusable components to create high-quality video conferencing experiences.

## 🚀 Features

- 📹 **Real-time video conferencing** with LiveKit
- 🎤 **Integrated audio and video controls**
- 👥 **Automatic participant management**
- 🎨 **Customizable web components** based on Lit
- 📱 **Responsive design**
- 🔊 **Visual speaking indicator**
- 👤 **Automatic avatars** when video is off

## 📦 Installation

### Using pnpm (recommended)

```bash
pnpm add @onlive.ai/meet
# or
npm install @onlive.ai/meet
```

## 🏗️ Package Structure

```
packages/meet/
├── index.ts                    # Main entry point
├── package.json               # Package configuration
├── tsconfig.json              # TypeScript configuration
├── tsup.config.ts             # Build configuration
└── components/
    └── meet/
        ├── meet.ts            # Main OLMMeet component
        ├── meet.styles.ts     # Component styles
        ├── meet.types.ts      # Types and interfaces
        └── met.context.ts     # Component context
```

## 🔧 Basic Usage

### ES Modules Import
```javascript
import { OLMMeet } from '@onlive.ai/meet';
```

### HTML Usage
```html
<olm-meet 
  .options="meetOptions"
  .livekitService="livekitServiceInstance"
  role="guest">
</olm-meet>
```

### TypeScript Configuration
```typescript
import { OLMMeet, MeetOptions } from '@onlive.ai/meet';
import { LivekitService } from '@onlive.ai/common-121';

const meetOptions: MeetOptions = {
  // Meeting configuration
};

const livekitService = new LivekitService();

// Component automatically registers as 'olm-meet'
```

## 📋 Component API

### Properties

| Property | Type | Description | Required |
|----------|------|-------------|----------|
| `options` | `MeetOptions` | Meeting configuration | ✅ |
| `livekitService` | `LivekitService` | LiveKit service instance | ✅ |
| `role` | `"agent" \| "guest"` | Participant role | ❌ (default: "guest") |

### Events

The component emits standard LiveKit events for handling connection state and participants.

## 🛠️ Development

### Available Scripts

- `npm run build:package` - Build package for distribution
- `npm run clean` - Clean generated files

### Main Dependencies

- **Lit** - Web components framework
- **LiveKit Client** - Video conferencing SDK
- **@onlive.ai/ui** - Shared UI components
- **@onlive.ai/common-121** - Common services and utilities

## 📝 Distribution Formats

The package is distributed in multiple formats:

- **ESM** (`index.js`) - ES Modules
- **CommonJS** (`index.cjs`) - Node.js
- **IIFE** (`index.iife.js`) - Direct browser
- **TypeScript** (`index.d.ts`) - Type definitions

## 🔗 Exports

```javascript
// Main export
import { OLMMeet } from '@onlive.ai/meet';

// Access to specific components
import '@onlive.ai/meet/components/meet/meet.js';
```