feat(docs): document MP4 export support and enhanced recording capabilities

readme.md

@@ -10,7 +10,7 @@
 - 🔧 **Real-time Property Editing** — Modify component props on the fly with auto-detected editors
 - 🌓 **Theme Switching** — Test light/dark modes instantly
 - 📱 **Responsive Viewport Testing** — Phone, phablet, tablet, and desktop views
-- 🎬 **Screen Recording** — Record component demos with audio support and video trimming
+- 🎬 **Screen Recording** — Record component demos with audio, trimming, and MP4/WebM export
 - 🧪 **Advanced Demo Tools** — Post-render hooks for interactive testing
 - 📂 **Section-based Organization** — Group components into custom sections with filtering and sorting
 - 🚀 **Zero-config Setup** — TypeScript and Lit support out of the box
@@ -235,15 +235,17 @@ public static styles = [
 
 ### 🎬 Screen Recording
 
-Record component demos directly from the catalogue:
+Record component demos directly from the catalogue with full export control:
 
 - **Viewport Recording** — Record just the component viewport
 - **Full Screen Recording** — Capture the entire screen
 - **Audio Support** — Add microphone commentary with live level monitoring
-- **Video Trimming** — Trim start/end before export with visual timeline
-- **WebM Export** — High-quality video output
+- **Video Trimming** — Trim start/end before export with a visual timeline
+- **60fps Capture** — Smooth, high-bitrate recording at up to 60 frames per second
+- **MP4 Export** — Universal H.264/AAC format via [mediabunny](https://mediabunny.dev) WebCodecs conversion (plays everywhere: WhatsApp, iMessage, Slack, etc.)
+- **WebM Export** — Native VP9 output for maximum quality
 
-Click the red record button in the bottom toolbar to start.
+Click the red record button in the bottom toolbar, choose your format (MP4 or WebM), and start recording.
 
 ### 🧪 Demo Tools
 
@@ -438,7 +440,7 @@ The wrapper provides full DOM API access:
 For custom recording integrations:
 
 ```typescript
-import { RecorderService } from '@design.estate/dees-wcctools';
+import { RecorderService, type TOutputFormat } from '@design.estate/dees-wcctools';
 
 const recorder = new RecorderService({
   onDurationUpdate: (duration) => console.log(`${duration}s`),
@@ -446,9 +448,13 @@ const recorder = new RecorderService({
   onAudioLevelUpdate: (level) => console.log(`Audio: ${level}%`),
 });
 
+// Record (always captures as WebM internally)
 await recorder.startRecording({ mode: 'viewport' });
 // ... later
 recorder.stopRecording();
+
+// Convert to MP4 for universal playback (H.264 + AAC via WebCodecs)
+const mp4Blob = await recorder.convertToMp4(recorder.recordedBlob);
 ```
 
 ## Project Structure
@@ -481,7 +487,7 @@ my-component-library/
 
 ## License and Legal Information
 
-This repository contains open-source code licensed under the MIT License. A copy of the license can be found in the [license](./license) file.
+This repository contains open-source code licensed under the MIT License. A copy of the license can be found in the [LICENSE](./LICENSE) file.
 
 **Please note:** The MIT License does not grant permission to use the trade names, trademarks, service marks, or product names of the project, except as required for reasonable and customary use in describing the origin of the work and reproducing the content of the NOTICE file.
 
@@ -493,7 +499,7 @@ Use of these trademarks must comply with Task Venture Capital GmbH's Trademark G
 
 ### Company Information
 
-Task Venture Capital GmbH
+Task Venture Capital GmbH  
 Registered at District Court Bremen HRB 35230 HB, Germany
 
 For any legal inquiries or further information, please contact us via email at hello@task.vc.