feat(iphone-15-pro): add webviewSrc media option and fix aspect ratio

[ladunjexa]

Summary

1. Fix iPhone 15 Pro sizing - The current imp doesn't carefully handle the width and height of the iPhone 15 Pro when passed as params, due to an unfixed viewBox. The first commit introduces a fix for this.
2. Add webviewSrc and update props - Introduced a new webviewSrc prop to support iframes, and renamed src to imageSrc prop for clarity

fix aspect ratio: demo video
webviewSrc prop: demo video

Notes

The current imp doesn't yet cover all edges cases, for example, issues may arise with internal frame src values, safari has more specific rendering quirks, also a fallback should be added when no src is provided (since src opts are all optional params), wrappnig the whole svg in a outer div with adjustments could improve the rendering, especially on iframes.

I decided left these improvements our of this PR to keep the scope focused, but they're on the roadmap.

Related

• Regarding fix(iphone-15-pro): resolve iOS device video masking issue with DOM overlay (breaking change) #780: while I appreciate the contribution, those changes felt too broad. Safari-related issues should be addressed in a more focused way, and that's what i'm planning to tackle next - I've already tackled most of these in a SaaS i'm working on.

btw, @dillionverma — MagicUI is brilliant work! 🎉

[vercel]

@ladunjexa is attempting to deploy a commit to the product-studio Team on Vercel.

A member of the Team first needs to authorize it.

[dillionverma]

appreciate your contribution! i decided to go forward with #780 approach since it addressed responsive issues across all browsers and devices