feat: remove ExcalidrawEmbeddableElement.validated flag (#7539)

packages/excalidraw/scene/Shape.ts

@@ -21,6 +21,7 @@ import {
   isLinearElement,
 } from "../element/typeChecks";
 import { canChangeRoundness } from "./comparisons";
+import { EmbedsValidationStatus } from "../types";
 
 const getDashArrayDashed = (strokeWidth: number) => [8, 8 + strokeWidth];
 
@@ -118,10 +119,13 @@ export const generateRoughOptions = (
 const modifyIframeLikeForRoughOptions = (
   element: NonDeletedExcalidrawElement,
   isExporting: boolean,
+  embedsValidationStatus: EmbedsValidationStatus | null,
 ) => {
   if (
     isIframeLikeElement(element) &&
-    (isExporting || (isEmbeddableElement(element) && !element.validated)) &&
+    (isExporting ||
+      (isEmbeddableElement(element) &&
+        embedsValidationStatus?.get(element.id) !== true)) &&
     isTransparent(element.backgroundColor) &&
     isTransparent(element.strokeColor)
   ) {
@@ -278,7 +282,12 @@ export const _generateElementShape = (
   {
     isExporting,
     canvasBackgroundColor,
-  }: { isExporting: boolean; canvasBackgroundColor: string },
+    embedsValidationStatus,
+  }: {
+    isExporting: boolean;
+    canvasBackgroundColor: string;
+    embedsValidationStatus: EmbedsValidationStatus | null;
+  },
 ): Drawable | Drawable[] | null => {
   switch (element.type) {
     case "rectangle":
@@ -299,7 +308,11 @@ export const _generateElementShape = (
             h - r
           } L 0 ${r} Q 0 0, ${r} 0`,
           generateRoughOptions(
-            modifyIframeLikeForRoughOptions(element, isExporting),
+            modifyIframeLikeForRoughOptions(
+              element,
+              isExporting,
+              embedsValidationStatus,
+            ),
             true,
           ),
         );
@@ -310,7 +323,11 @@ export const _generateElementShape = (
           element.width,
           element.height,
           generateRoughOptions(
-            modifyIframeLikeForRoughOptions(element, isExporting),
+            modifyIframeLikeForRoughOptions(
+              element,
+              isExporting,
+              embedsValidationStatus,
+            ),
             false,
           ),
         );

packages/excalidraw/scene/ShapeCache.ts

@@ -8,7 +8,7 @@ import { elementWithCanvasCache } from "../renderer/renderElement";
 import { _generateElementShape } from "./Shape";
 import { ElementShape, ElementShapes } from "./types";
 import { COLOR_PALETTE } from "../colors";
-import { AppState } from "../types";
+import { AppState, EmbedsValidationStatus } from "../types";
 
 export class ShapeCache {
   private static rg = new RoughGenerator();
@@ -51,6 +51,7 @@ export class ShapeCache {
     renderConfig: {
       isExporting: boolean;
       canvasBackgroundColor: AppState["viewBackgroundColor"];
+      embedsValidationStatus: EmbedsValidationStatus;
     } | null,
   ) => {
     // when exporting, always regenerated to guarantee the latest shape
@@ -72,6 +73,7 @@ export class ShapeCache {
       renderConfig || {
         isExporting: false,
         canvasBackgroundColor: COLOR_PALETTE.white,
+        embedsValidationStatus: null,
       },
     ) as T["type"] extends keyof ElementShapes
       ? ElementShapes[T["type"]]

packages/excalidraw/scene/export.ts

@@ -266,6 +266,8 @@ export const exportToCanvas = async (
       imageCache,
       renderGrid: false,
       isExporting: true,
+      // empty disables embeddable rendering
+      embedsValidationStatus: new Map(),
       elementsPendingErasure: new Set(),
     },
   });
@@ -288,6 +290,9 @@ export const exportToSvg = async (
   },
   files: BinaryFiles | null,
   opts?: {
+    /**
+     * if true, all embeddables passed in will be rendered when possible.
+     */
     renderEmbeddables?: boolean;
     exportingFrame?: ExcalidrawFrameLikeElement | null;
   },
@@ -428,14 +433,24 @@ export const exportToSvg = async (
   }
 
   const rsvg = rough.svg(svgRoot);
+
+  const renderEmbeddables = opts?.renderEmbeddables ?? false;
+
   renderSceneToSvg(elementsForRender, rsvg, svgRoot, files || {}, {
     offsetX,
     offsetY,
     isExporting: true,
     exportWithDarkMode,
-    renderEmbeddables: opts?.renderEmbeddables ?? false,
+    renderEmbeddables,
     frameRendering,
     canvasBackgroundColor: viewBackgroundColor,
+    embedsValidationStatus: renderEmbeddables
+      ? new Map(
+          elementsForRender
+            .filter((element) => isFrameLikeElement(element))
+            .map((element) => [element.id, true]),
+        )
+      : new Map(),
   });
 
   tempScene.destroy();

packages/excalidraw/scene/types.ts

@@ -7,6 +7,7 @@ import {
 import {
   AppClassProperties,
   AppState,
+  EmbedsValidationStatus,
   ElementsPendingErasure,
   InteractiveCanvasAppState,
   StaticCanvasAppState,
@@ -21,6 +22,7 @@ export type StaticCanvasRenderConfig = {
   /** when exporting the behavior is slightly different (e.g. we can't use
    CSS filters), and we disable render optimizations for best output */
   isExporting: boolean;
+  embedsValidationStatus: EmbedsValidationStatus;
   elementsPendingErasure: ElementsPendingErasure;
 };
 
@@ -32,6 +34,7 @@ export type SVGRenderConfig = {
   renderEmbeddables: boolean;
   frameRendering: AppState["frameRendering"];
   canvasBackgroundColor: AppState["viewBackgroundColor"];
+  embedsValidationStatus: EmbedsValidationStatus;
 };
 
 export type InteractiveCanvasRenderConfig = {