# Player Icons Asset Guide

## PlayerIconButton Component

A new `PlayerIconButton` component has been created that automatically uses your assets:

```swift
PlayerIconButton(iconName: "player_plus") {
    // Handle action
}
```

### Specifications (from Figma):
- **Button Size**: 40x40pt
- **Icon Size**: 16x16pt (size-4 in Tailwind)
- **Background**: White 4% opacity with ultra thin material blur
- **Border Radius**: 100px (fully rounded)

### Usage Examples:
- Audio section plus button: `PlayerIconButton(iconName: "player_plus")`
- Any other player controls: `PlayerIconButton(iconName: "icon_name")`

## Required Assets for VideoPlayerView Component

Based on the Figma design, these icon assets should be 16x16pt:

### 1. player_heart.imageset
- **Design**: Heart/like icon from right side controls
- **Size**: 16x16pt
- **Format**: PDF (vector) recommended
- **Usage**: Like/heart button in player controls

### 2. player_comment.imageset  
- **Design**: Comment/message icon from right side controls
- **Size**: 16x16pt
- **Format**: PDF (vector) recommended
- **Usage**: Comment button in player controls

### 3. player_share.imageset
- **Design**: Share arrow icon from right side controls
- **Size**: 16x16pt
- **Format**: PDF (vector) recommended
- **Usage**: Share button in player controls

### 4. player_more.imageset
- **Design**: More horizontal dots icon from right side controls
- **Size**: 16x16pt
- **Format**: PDF (vector) recommended
- **Usage**: More options button in player controls

### 5. player_plus.imageset
- **Design**: Plus icon for various player buttons
- **Size**: 16x16pt
- **Format**: PDF (vector) recommended
- **Usage**: Add buttons throughout player interface

### 6. player_play.imageset
- **Design**: Play icon for audio section
- **Size**: 10x10pt (smaller variant)
- **Format**: PDF (vector) recommended
- **Usage**: Play indicator in audio information

## Asset Integration
The PlayerIconButton component uses `Image(iconName)` to pull icons directly from your assets library. Simply add the SVG/PDF files to the respective .imageset folders and the component will automatically display them with proper styling.

## Existing Assets
I can see you've already added some player icons:
- ✅ `comment.imageset` - Comment icon
- ✅ `heart.imageset` - Heart/like icon  
- ✅ `more.imageset` - More dots icon
- ✅ `plus.imageset` - Plus icon
- ✅ `share.imageset` - Share arrow icon

These can be used directly with the PlayerIconButton component!