<!-- source-hash: d907992b7d3c6c815ed4b06b496e2ab0 -->
A reusable React iframe wrapper component that handles loading state with a skeleton placeholder and prevents memory leaks during unmount or `src` changes.

## Key Components

### `EmbedLoadingSkeleton` (internal)
A pulsing rectangle placeholder rendered while the iframe content loads. Uses `bg-ods-card` instead of `bg-ods-skeleton` to ensure visibility (the skeleton token resolves to transparent in this build).

### `EmbedIframeProps`
| Prop | Type | Default | Description |
|---|---|---|---|
| `src` | `string` | — | URL to embed |
| `title` | `string` | — | Accessible iframe title |
| `height` | `string` | `calc(100vh - 250px)` | Container height (CSS value) |
| `className` | `string` | — | Extra classes for outer container |
| `allow` | `string` | — | iframe `allow` attribute |
| `referrerPolicy` | `ReferrerPolicy` | — | iframe referrer policy |
| `loading` | `'eager' \| 'lazy'` | — | iframe loading strategy |
| `allowFullScreen` | `boolean` | — | Fullscreen permission (ignored if `allow` includes `"fullscreen"`) |

### `EmbedIframe`
The main exported component. Uses `key={src}` to force full remount on `src` change and sets `iframe.src = 'about:blank'` on cleanup to release the embedded document and avoid memory leaks.

## Usage Example

```typescript
import { EmbedIframe } from './embed-iframe'

export function DashboardEmbed() {
  return (
    <EmbedIframe
      src="https://app.example.com/embed/dashboard"
      title="Metrics Dashboard"
      height="600px"
      allow="fullscreen"
      loading="lazy"
      referrerPolicy="strict-origin-when-cross-origin"
    />
  )
}
```

## Memory Leak Prevention

Two `useEffect` hooks guard against leaks:
1. **`src` change** — resets `isLoaded` to `false`, triggering the skeleton.
2. **Unmount cleanup** — sets `iframe.src = 'about:blank'` inside a `try/catch` (cross-origin iframes may throw on `src` assignment).

---

**Source:** [`embed-iframe.tsx`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/embed-iframe.tsx)