# Examples

Copy-paste integration references for `@oddin-gg/havik-player`. See
[docs/API.md](https://github.com/oddin-gg/havik-html5/blob/main/docs/API.md) for the full API.

| File | Stack | Notes |
|---|---|---|
| [`vanilla.html`](vanilla.html) | Plain `<script>` (CDN) | Self-contained page using `window.HavikPlayer`. |
| [`react.tsx`](react.tsx) | React 18+ | `useEffect` lifecycle with StrictMode-safe cleanup. |
| [`Vue.vue`](Vue.vue) | Vue 3 | `onMounted` / `onBeforeUnmount` lifecycle. |

For every framework the rule is the same: **create the player when the element
mounts, and call `player.destroy()` when it unmounts** (it tears down hls.js + the
EME/CDM session). The React example also guards against StrictMode's double-invoke.

Before any of these work, the api-key's **AllowedOrigins** (and the DRM service's
CORS allow-list) must include the page's origin — see the README's onboarding note.