# Replace iFrame with Shadow DOM for Email Content Rendering
## Description
Replaced the `MailIframe` component with a new `MailContent` component that uses Shadow DOM instead of iframes for rendering email content. This approach provides better security isolation while maintaining styling control and performance. The implementation uses DOMPurify for sanitization and includes proper handling of external images, trusted senders, and theme adaptation.
## Type of Change
- ✨ New feature (non-breaking change which adds functionality)
- 🔒 Security enhancement
- ⚡ Performance improvement
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
* **New Features**
* Introduced a new email content viewer that securely displays HTML emails with improved security, style isolation, and theme support.
* Added user controls to manage image loading and trust email senders directly from the email view.
* **Refactor**
* Replaced the previous email iframe viewer with the new secure content viewer, streamlining functionality and enhancing user experience.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
- Added `@react-email/components` dependency to `bun.lock` and `package.json`.
- Removed the `extractText.ts` file as it is no longer needed.
- Refactored email rendering in `mail-iframe.tsx` to utilize the new `template` function from `email-utils.client.tsx`.
- Improved handling of image loading based on sender trust status.
- Updated various components to enhance readability and maintainability.
- Created demo JSON with sample email threads
- Implemented DemoMailLayout component for static mail preview
- Added demo components for MailList and ThreadDisplay
- Updated home page to include demo mail layout
- Introduced conditional rendering for demo mode in mail components
