suport iFrame

src/components/App.tsx

@@ -1039,7 +1039,7 @@ class App extends React.Component<AppProps, AppState> {
             this.state.activeEmbeddable?.state === "hover";
 
           // Modify the scale based on el.scale property
-          const [xScale, yScale] = el.scale;
+          const [xScale, yScale] = el.scale ?? [1, 1];
           const scaledTransform = `scale(${scale * xScale}, ${scale * yScale})`;
 
           return (
@@ -1056,10 +1056,9 @@ class App extends React.Component<AppProps, AppState> {
                   : "none",
                 display: isVisible ? "block" : "none",
                 opacity: el.opacity / 100,
-                ["--embeddable-radius" as string]: `${getCornerRadius(
-                  Math.min(el.width, el.height),
-                  el,
-                )}px`,
+                ["--embeddable-radius" as string]: `${
+                  getCornerRadius(Math.min(el.width, el.height), el) / xScale
+                }px`,
               }}
             >
               <div

src/data/restore.ts

@@ -294,8 +294,11 @@ const restoreElement = (
     case "ellipse":
     case "rectangle":
     case "diamond":
-    case "iframe":
       return restoreElementWithProperties(element, {});
+    case "iframe":
+      return restoreElementWithProperties(element, {
+        scale: element.scale ?? [1, 1],
+      });
     case "embeddable":
       return restoreElementWithProperties(element, {
         validated: null,

src/element/newElement.ts

@@ -153,6 +153,7 @@ export const newIframeElement = (
 ): NonDeleted<ExcalidrawIframeElement> => {
   return {
     ..._newElementBase<ExcalidrawIframeElement>("iframe", opts),
+    scale: [1, 1],
   };
 };
 

src/element/resizeElements.ts

@@ -27,6 +27,7 @@ import {
 import {
   isArrowElement,
   isBoundToContainer,
+  isIframeLikeElement,
   isFrameLikeElement,
   isFreeDrawElement,
   isImageElement,
@@ -586,7 +587,7 @@ export const resizeSingleElement = (
   };
 
   if ("scale" in element && "scale" in stateAtResizeStart) {
-    if (isFrameLikeElement(element)) {
+    if (isIframeLikeElement(element)) {
       if (shouldMaintainAspectRatio) {
         const scale: [number, number] = [
           Math.abs(

src/element/types.ts

@@ -104,6 +104,7 @@ export type ExcalidrawIframeElement = _ExcalidrawElementBase &
     type: "iframe";
     // TODO move later to AI-specific frame
     customData?: { generationData?: MagicCacheData };
+    scale: [number, number];
   }>;
 
 export type ExcalidrawIframeLikeElement =

src/renderer/renderElement.ts

@@ -13,7 +13,7 @@ import {
   isInitializedImageElement,
   isArrowElement,
   hasBoundTextElement,
-  isFrameLikeElement,
+  isIframeLikeElement,
   isMagicFrameElement,
 } from "../element/typeChecks";
 import { getElementAbsoluteCoords } from "../element/bounds";
@@ -522,7 +522,7 @@ const drawElementFromCanvas = (
     if (
       "scale" in elementWithCanvas.element &&
       !isPendingImageElement(element, renderConfig) &&
-      !isFrameLikeElement(element)
+      !isIframeLikeElement(element)
     ) {
       context.scale(
         elementWithCanvas.element.scale[0],