<DriveMedia /> Universal Component
The all-in-one universal component for Google Drive images, videos, audio, and documents.
Overview
DriveMedia auto-detects whether the asset is an image, video, audio track, or PDF document and renders the specialized component seamlessly.
Code Example
drive-media.tsx
| 1 | import { DriveMedia } from '@driveloader/react'; |
| 2 | |
| 3 | <DriveMedia |
| 4 | src="https://drive.google.com/file/d/1BxiMVs0XRA5nFMdKvBdBZjgmUUqptlbs/view" |
| 5 | alt="Universal Media Asset" |
| 6 | controls |
| 7 | autoPlay={false} |
| 8 | /> |
Best Practices
- •Use type='auto' (default) for mixed-media collections.
- •Pass standard HTML5 attributes like 'controls' and 'autoPlay' which will be forwarded to the correct underlying element.
Common Mistakes
- ×Passing unsupported props for specific media types (e.g., passing 'showWaveform' when the asset is an image).
Performance Notes
Media detection adds less than 1ms of overhead using regex-based local parsing before network requests.