@meowdown/react 0.60.0 → 0.61.0

package/dist/index.js

@@ -2163,7 +2163,8 @@ function WikilinkChip(props) {
 		})]
 	});
 }
-function EmbedFrame({ embed }) {
+function EmbedFrame(props) {
+	const { embed, width, height } = props;
 	const iframeRef = useRef(null);
 	useEffect(() => {
 		if (embed.kind !== "tweet") return;
@@ -2171,6 +2172,8 @@ function EmbedFrame({ embed }) {
 		if (!iframe) return;
 		return listenForTweetHeight(iframe);
 	}, [embed.kind, embed.key]);
+	const youtubeWidth = embed.kind === "youtube" ? width : null;
+	const tweetHeight = embed.kind === "tweet" ? height : null;
 	return /* @__PURE__ */ jsx("span", {
 		className: "md-image-view-preview md-atom-view-preview",
 		contentEditable: false,
@@ -2184,14 +2187,20 @@ function EmbedFrame({ embed }) {
 			referrerPolicy: "strict-origin-when-cross-origin",
 			frameBorder: "0",
 			allow: embed.allow,
-			allowFullScreen: embed.allowFullscreen
+			allowFullScreen: embed.allowFullscreen,
+			style: youtubeWidth != null ? { width: youtubeWidth } : tweetHeight != null ? { height: tweetHeight } : void 0,
+			"data-sized": tweetHeight == null ? void 0 : ""
 		}, embed.key)
 	});
 }
 function ImagePreview(props) {
-	const { src, alt, width, resolveImageUrl, onImageClick, interactive } = props;
+	const { src, alt, width, height, resolveImageUrl, onImageClick, interactive } = props;
 	const embed = matchEmbed(src);
-	if (embed) return interactive ? /* @__PURE__ */ jsx(EmbedFrame, { embed }) : null;
+	if (embed) return interactive ? /* @__PURE__ */ jsx(EmbedFrame, {
+		embed,
+		width,
+		height
+	}) : null;
 	const url = (resolveImageUrl ?? defaultResolveImageUrl)(src);
 	if (!url) return null;
 	return /* @__PURE__ */ jsx("span", {
@@ -2212,13 +2221,14 @@ function ImagePreview(props) {
 	});
 }
 function ImageView(props) {
-	const { src, alt, width, context, children } = props;
+	const { src, alt, width, height, context, children } = props;
 	return /* @__PURE__ */ jsxs("span", {
 		className: "md-image-view md-atom-view",
 		children: [/* @__PURE__ */ jsx(ImagePreview, {
 			src,
 			alt,
 			width,
+			height,
 			resolveImageUrl: context.resolveImageUrl,
 			onImageClick: context.onImageClick,
 			interactive: context.interactive
@@ -2408,6 +2418,7 @@ function wrapMark(mark, children, context) {
 				src: attrs.src,
 				alt: attrs.alt,
 				width: attrs.width,
+				height: attrs.height,
 				context,
 				children
 			});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@meowdown/react",
   "type": "module",
-  "version": "0.60.0",
+  "version": "0.61.0",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -31,7 +31,7 @@
     "github-slugger": "^2.0.0",
     "lucide-react": "^1.27.0",
     "react-property": "^2.0.2",
-    "@meowdown/core": "0.60.0"
+    "@meowdown/core": "0.61.0"
   },
   "peerDependencies": {
     "react": "^19.0.0",