@nous-excalidraw/excalidraw 0.18.0 → 0.18.2

package/dist/dev/index.js

@@ -65,10 +65,10 @@ import {
   serializeAsJSON,
   serializeLibraryAsJSON,
   strokeRectWithRotation_simple
-} from "./chunk-BJORJAH3.js";
+} from "./chunk-VTFWC67S.js";
 import {
   define_import_meta_env_default
-} from "./chunk-JHTRI4CR.js";
+} from "./chunk-UFTMCXXK.js";
 import {
   en_default
 } from "./chunk-4JOINNOK.js";
@@ -239,7 +239,7 @@ import {
   isUsingAdaptiveRadius as isUsingAdaptiveRadius4,
   isIframeElement as isIframeElement2,
   isIframeLikeElement as isIframeLikeElement2,
-  isMagicFrameElement as isMagicFrameElement2,
+  isMagicFrameElement,
   isTextBindableContainer as isTextBindableContainer3,
   isElbowArrow as isElbowArrow10,
   isFlowchartNodeElement as isFlowchartNodeElement2,
@@ -9630,7 +9630,7 @@ var exportCanvas = async (type, elements, appState, files, {
     let blob = canvasToBlob(tempCanvas);
     if (appState.exportEmbedScene) {
       blob = blob.then(
-        (blob2) => import("./data/image-IFYIQRIJ.js").then(
+        (blob2) => import("./data/image-R33I73P5.js").then(
           ({ encodePngMetadata: encodePngMetadata2 }) => encodePngMetadata2({
             blob: blob2,
             metadata: serializeAsJSON(elements, appState, files, "local")
@@ -25846,6 +25846,151 @@ var MobileMenu = ({
 // components/PasteChartDialog.tsx
 import React31, { useLayoutEffect as useLayoutEffect5, useRef as useRef26, useState as useState29 } from "react";
 import { newTextElement as newTextElement3 } from "@nous-excalidraw/element";
+
+// ../utils/src/withinBounds.ts
+import { arrayToMap as arrayToMap24 } from "@nous-excalidraw/common";
+import { getElementBounds as getElementBounds4 } from "@nous-excalidraw/element";
+import {
+  isArrowElement as isArrowElement10,
+  isExcalidrawElement as isExcalidrawElement3,
+  isFreeDrawElement as isFreeDrawElement4,
+  isLinearElement as isLinearElement9,
+  isTextElement as isTextElement11
+} from "@nous-excalidraw/element";
+import {
+  rangeIncludesValue,
+  pointFrom as pointFrom27,
+  pointRotateRads as pointRotateRads18,
+  rangeInclusive as rangeInclusive2
+} from "@nous-excalidraw/math";
+var getNonLinearElementRelativePoints = (element) => {
+  if (element.type === "diamond") {
+    return [
+      pointFrom27(element.width / 2, 0),
+      pointFrom27(element.width, element.height / 2),
+      pointFrom27(element.width / 2, element.height),
+      pointFrom27(0, element.height / 2)
+    ];
+  }
+  return [
+    pointFrom27(0, 0),
+    pointFrom27(0 + element.width, 0),
+    pointFrom27(0 + element.width, element.height),
+    pointFrom27(0, element.height)
+  ];
+};
+var getElementRelativePoints = (element) => {
+  if (isLinearElement9(element) || isFreeDrawElement4(element)) {
+    return element.points;
+  }
+  return getNonLinearElementRelativePoints(element);
+};
+var getMinMaxPoints = (points) => {
+  const ret = points.reduce(
+    (limits, [x, y]) => {
+      limits.minY = Math.min(limits.minY, y);
+      limits.minX = Math.min(limits.minX, x);
+      limits.maxX = Math.max(limits.maxX, x);
+      limits.maxY = Math.max(limits.maxY, y);
+      return limits;
+    },
+    {
+      minX: Infinity,
+      minY: Infinity,
+      maxX: -Infinity,
+      maxY: -Infinity,
+      cx: 0,
+      cy: 0
+    }
+  );
+  ret.cx = (ret.maxX + ret.minX) / 2;
+  ret.cy = (ret.maxY + ret.minY) / 2;
+  return ret;
+};
+var getRotatedBBox = (element) => {
+  const points = getElementRelativePoints(element);
+  const { cx, cy } = getMinMaxPoints(points);
+  const centerPoint = pointFrom27(cx, cy);
+  const rotatedPoints = points.map(
+    (p) => pointRotateRads18(p, centerPoint, element.angle)
+  );
+  const { minX, minY, maxX, maxY } = getMinMaxPoints(rotatedPoints);
+  return [
+    minX + element.x,
+    minY + element.y,
+    maxX + element.x,
+    maxY + element.y
+  ];
+};
+var isElementInsideBBox = (element, bbox, eitherDirection = false) => {
+  const elementBBox = getRotatedBBox(element);
+  const elementInsideBbox = bbox[0] <= elementBBox[0] && bbox[2] >= elementBBox[2] && bbox[1] <= elementBBox[1] && bbox[3] >= elementBBox[3];
+  if (!eitherDirection) {
+    return elementInsideBbox;
+  }
+  if (elementInsideBbox) {
+    return true;
+  }
+  return elementBBox[0] <= bbox[0] && elementBBox[2] >= bbox[2] && elementBBox[1] <= bbox[1] && elementBBox[3] >= bbox[3];
+};
+var elementPartiallyOverlapsWithOrContainsBBox = (element, bbox) => {
+  const elementBBox = getRotatedBBox(element);
+  return (rangeIncludesValue(elementBBox[0], rangeInclusive2(bbox[0], bbox[2])) || rangeIncludesValue(
+    bbox[0],
+    rangeInclusive2(elementBBox[0], elementBBox[2])
+  )) && (rangeIncludesValue(elementBBox[1], rangeInclusive2(bbox[1], bbox[3])) || rangeIncludesValue(
+    bbox[1],
+    rangeInclusive2(elementBBox[1], elementBBox[3])
+  ));
+};
+var elementsOverlappingBBox = ({
+  elements,
+  bounds,
+  type,
+  errorMargin = 0
+}) => {
+  if (isExcalidrawElement3(bounds)) {
+    bounds = getElementBounds4(bounds, arrayToMap24(elements));
+  }
+  const adjustedBBox = [
+    bounds[0] - errorMargin,
+    bounds[1] - errorMargin,
+    bounds[2] + errorMargin,
+    bounds[3] + errorMargin
+  ];
+  const includedElementSet = /* @__PURE__ */ new Set();
+  for (const element of elements) {
+    if (includedElementSet.has(element.id)) {
+      continue;
+    }
+    const isOverlaping = type === "overlap" ? elementPartiallyOverlapsWithOrContainsBBox(element, adjustedBBox) : type === "inside" ? isElementInsideBBox(element, adjustedBBox) : isElementInsideBBox(element, adjustedBBox, true);
+    if (isOverlaping) {
+      includedElementSet.add(element.id);
+      if (element.boundElements) {
+        for (const boundElement of element.boundElements) {
+          includedElementSet.add(boundElement.id);
+        }
+      }
+      if (isTextElement11(element) && element.containerId) {
+        includedElementSet.add(element.containerId);
+      }
+      if (isArrowElement10(element)) {
+        if (element.startBinding) {
+          includedElementSet.add(element.startBinding.elementId);
+        }
+        if (element.endBinding) {
+          includedElementSet.add(element.endBinding?.elementId);
+        }
+      }
+    }
+  }
+  return elements.filter((element) => includedElementSet.has(element.id));
+};
+
+// ../utils/src/index.ts
+import { getCommonBounds as getCommonBounds6 } from "@nous-excalidraw/element";
+
+// components/PasteChartDialog.tsx
 import { jsx as jsx95, jsxs as jsxs54 } from "react/jsx-runtime";
 var getChartTypeLabel = (chartType) => {
   switch (chartType) {
@@ -25886,19 +26031,17 @@ var ChartPreviewBtn = (props) => {
     let svg;
     const previewNode = previewRef.current;
     (async () => {
-      svg = await exportToSvg(
+      svg = await exportToSvg2({
         elements,
-        {
+        appState: {
           exportBackground: false,
           viewBackgroundColor: "#fff",
           exportWithDarkMode: theme === "dark"
         },
-        null,
+        files: null,
         // files
-        {
-          skipInliningFonts: true
-        }
-      );
+        exportPadding: 0
+      });
       svg.querySelector(".style-fonts")?.remove();
       previewNode.replaceChildren();
       previewNode.appendChild(svg);
@@ -25940,18 +26083,16 @@ var PlainTextPreviewBtn = (props) => {
     });
     const previewNode = previewRef.current;
     (async () => {
-      const svg = await exportToSvg(
-        [textElement],
-        {
+      const svg = await exportToSvg2({
+        elements: [textElement],
+        appState: {
           exportBackground: false,
           viewBackgroundColor: "#fff",
           exportWithDarkMode: theme === "dark"
         },
-        null,
-        {
-          skipInliningFonts: true
-        }
-      );
+        files: null,
+        exportPadding: 0
+      });
       svg.querySelector(".style-fonts")?.remove();
       previewNode.replaceChildren();
       previewNode.appendChild(svg);
@@ -27638,7 +27779,7 @@ import {
   getFontString as getFontString10
 } from "@nous-excalidraw/common";
 import { newTextElement as newTextElement4 } from "@nous-excalidraw/element";
-import { isTextElement as isTextElement11, isFrameLikeElement as isFrameLikeElement10 } from "@nous-excalidraw/element";
+import { isTextElement as isTextElement12, isFrameLikeElement as isFrameLikeElement10 } from "@nous-excalidraw/element";
 import { getDefaultFrameName } from "@nous-excalidraw/element/frame";
 import { Fragment as Fragment18, jsx as jsx115, jsxs as jsxs67 } from "react/jsx-runtime";
 var searchQueryAtom = atom("");
@@ -27967,7 +28108,7 @@ var MatchListBase = (props) => {
     [props.matches]
   );
   const textMatches = useMemo9(
-    () => props.matches.items.filter((match) => isTextElement11(match.element)),
+    () => props.matches.items.filter((match) => isTextElement12(match.element)),
     [props.matches]
   );
   return /* @__PURE__ */ jsxs67("div", { children: [
@@ -28170,7 +28311,7 @@ var handleSearch = debounce2(
     }
     const elements = app.scene.getNonDeletedElements();
     const texts = elements.filter(
-      (el) => isTextElement11(el)
+      (el) => isTextElement12(el)
     );
     const frames = elements.filter(
       (el) => isFrameLikeElement10(el)
@@ -28340,7 +28481,7 @@ var TTDDialogInput = ({
         setShowSpinner(true);
       }
     }, SPINNER_DELAY_MS);
-    import("./components/TTDDialog/CodeMirrorEditor-EJU7XIUQ.js").then((mod) => {
+    import("./components/TTDDialog/CodeMirrorEditor-TCVBULR7.js").then((mod) => {
       if (!cancelled) {
         setEditorState({ type: "ready", component: mod.default });
       }
@@ -28815,151 +28956,6 @@ import {
   THEME as THEME15
 } from "@nous-excalidraw/common";
 import { convertToExcalidrawElements } from "@nous-excalidraw/element";
-
-// ../utils/src/withinBounds.ts
-import { arrayToMap as arrayToMap24 } from "@nous-excalidraw/common";
-import { getElementBounds as getElementBounds4 } from "@nous-excalidraw/element";
-import {
-  isArrowElement as isArrowElement10,
-  isExcalidrawElement as isExcalidrawElement3,
-  isFreeDrawElement as isFreeDrawElement4,
-  isLinearElement as isLinearElement9,
-  isTextElement as isTextElement12
-} from "@nous-excalidraw/element";
-import {
-  rangeIncludesValue,
-  pointFrom as pointFrom27,
-  pointRotateRads as pointRotateRads18,
-  rangeInclusive as rangeInclusive2
-} from "@nous-excalidraw/math";
-var getNonLinearElementRelativePoints = (element) => {
-  if (element.type === "diamond") {
-    return [
-      pointFrom27(element.width / 2, 0),
-      pointFrom27(element.width, element.height / 2),
-      pointFrom27(element.width / 2, element.height),
-      pointFrom27(0, element.height / 2)
-    ];
-  }
-  return [
-    pointFrom27(0, 0),
-    pointFrom27(0 + element.width, 0),
-    pointFrom27(0 + element.width, element.height),
-    pointFrom27(0, element.height)
-  ];
-};
-var getElementRelativePoints = (element) => {
-  if (isLinearElement9(element) || isFreeDrawElement4(element)) {
-    return element.points;
-  }
-  return getNonLinearElementRelativePoints(element);
-};
-var getMinMaxPoints = (points) => {
-  const ret = points.reduce(
-    (limits, [x, y]) => {
-      limits.minY = Math.min(limits.minY, y);
-      limits.minX = Math.min(limits.minX, x);
-      limits.maxX = Math.max(limits.maxX, x);
-      limits.maxY = Math.max(limits.maxY, y);
-      return limits;
-    },
-    {
-      minX: Infinity,
-      minY: Infinity,
-      maxX: -Infinity,
-      maxY: -Infinity,
-      cx: 0,
-      cy: 0
-    }
-  );
-  ret.cx = (ret.maxX + ret.minX) / 2;
-  ret.cy = (ret.maxY + ret.minY) / 2;
-  return ret;
-};
-var getRotatedBBox = (element) => {
-  const points = getElementRelativePoints(element);
-  const { cx, cy } = getMinMaxPoints(points);
-  const centerPoint = pointFrom27(cx, cy);
-  const rotatedPoints = points.map(
-    (p) => pointRotateRads18(p, centerPoint, element.angle)
-  );
-  const { minX, minY, maxX, maxY } = getMinMaxPoints(rotatedPoints);
-  return [
-    minX + element.x,
-    minY + element.y,
-    maxX + element.x,
-    maxY + element.y
-  ];
-};
-var isElementInsideBBox = (element, bbox, eitherDirection = false) => {
-  const elementBBox = getRotatedBBox(element);
-  const elementInsideBbox = bbox[0] <= elementBBox[0] && bbox[2] >= elementBBox[2] && bbox[1] <= elementBBox[1] && bbox[3] >= elementBBox[3];
-  if (!eitherDirection) {
-    return elementInsideBbox;
-  }
-  if (elementInsideBbox) {
-    return true;
-  }
-  return elementBBox[0] <= bbox[0] && elementBBox[2] >= bbox[2] && elementBBox[1] <= bbox[1] && elementBBox[3] >= bbox[3];
-};
-var elementPartiallyOverlapsWithOrContainsBBox = (element, bbox) => {
-  const elementBBox = getRotatedBBox(element);
-  return (rangeIncludesValue(elementBBox[0], rangeInclusive2(bbox[0], bbox[2])) || rangeIncludesValue(
-    bbox[0],
-    rangeInclusive2(elementBBox[0], elementBBox[2])
-  )) && (rangeIncludesValue(elementBBox[1], rangeInclusive2(bbox[1], bbox[3])) || rangeIncludesValue(
-    bbox[1],
-    rangeInclusive2(elementBBox[1], elementBBox[3])
-  ));
-};
-var elementsOverlappingBBox = ({
-  elements,
-  bounds,
-  type,
-  errorMargin = 0
-}) => {
-  if (isExcalidrawElement3(bounds)) {
-    bounds = getElementBounds4(bounds, arrayToMap24(elements));
-  }
-  const adjustedBBox = [
-    bounds[0] - errorMargin,
-    bounds[1] - errorMargin,
-    bounds[2] + errorMargin,
-    bounds[3] + errorMargin
-  ];
-  const includedElementSet = /* @__PURE__ */ new Set();
-  for (const element of elements) {
-    if (includedElementSet.has(element.id)) {
-      continue;
-    }
-    const isOverlaping = type === "overlap" ? elementPartiallyOverlapsWithOrContainsBBox(element, adjustedBBox) : type === "inside" ? isElementInsideBBox(element, adjustedBBox) : isElementInsideBBox(element, adjustedBBox, true);
-    if (isOverlaping) {
-      includedElementSet.add(element.id);
-      if (element.boundElements) {
-        for (const boundElement of element.boundElements) {
-          includedElementSet.add(boundElement.id);
-        }
-      }
-      if (isTextElement12(element) && element.containerId) {
-        includedElementSet.add(element.containerId);
-      }
-      if (isArrowElement10(element)) {
-        if (element.startBinding) {
-          includedElementSet.add(element.startBinding.elementId);
-        }
-        if (element.endBinding) {
-          includedElementSet.add(element.endBinding?.elementId);
-        }
-      }
-    }
-  }
-  return elements.filter((element) => includedElementSet.has(element.id));
-};
-
-// ../utils/src/index.ts
-import { getCommonBounds as getCommonBounds6 } from "@nous-excalidraw/element";
-
-// components/TTDDialog/common.ts
 var resetPreview = ({
   canvasRef,
   setError
@@ -37872,7 +37868,7 @@ var App = class _App extends React46.Component {
         this.setActiveTool({ type: TOOL_TYPE3.magicframe });
         trackEvent("ai", "tool-select (empty-selection)", "d2c");
       } else {
-        const selectedMagicFrame = selectedElements.length === 1 && isMagicFrameElement2(selectedElements[0]) && selectedElements[0];
+        const selectedMagicFrame = selectedElements.length === 1 && isMagicFrameElement(selectedElements[0]) && selectedElements[0];
         if (!selectedMagicFrame && selectedElements.some((el) => isFrameLikeElement15(el) || el.frameId)) {
           this.setActiveTool({ type: TOOL_TYPE3.magicframe });
           return;
@@ -41979,6 +41975,16 @@ var App = class _App extends React46.Component {
       );
       const dataTransferList = await parseDataTransferEvent(event);
       const fileItems = dataTransferList.getFiles();
+      if (fileItems.length > 0) {
+        const files = fileItems.map((item) => item.file).filter((file2) => file2 != null);
+        const isSinglePngOrSvgSceneCandidate = files.length === 1 && (files[0].type === MIME_TYPES9.png || files[0].type === MIME_TYPES9.svg);
+        const hasSupportedImage = files.some(
+          (file2) => isSupportedImageFile(file2)
+        );
+        if (!isSinglePngOrSvgSceneCandidate && !hasSupportedImage) {
+          return;
+        }
+      }
       if (fileItems.length === 1) {
         const { file: file2, fileHandle } = fileItems[0];
         if (file2 && (file2.type === MIME_TYPES9.png || file2.type === MIME_TYPES9.svg)) {
@@ -43439,7 +43445,7 @@ var App = class _App extends React46.Component {
                               },
                               firstSelectedElement.id
                             ),
-                            this.props.aiEnabled !== false && selectedElements.length === 1 && isMagicFrameElement2(firstSelectedElement) && /* @__PURE__ */ jsx162(
+                            this.props.aiEnabled !== false && selectedElements.length === 1 && isMagicFrameElement(firstSelectedElement) && /* @__PURE__ */ jsx162(
                               ElementCanvasButtons,
                               {
                                 element: firstSelectedElement,
@@ -43644,7 +43650,7 @@ var App = class _App extends React46.Component {
       this.scene.getNonDeletedElements(),
       magicFrame,
       this.scene.getNonDeletedElementsMap()
-    ).filter((el) => !isMagicFrameElement2(el));
+    ).filter((el) => !isMagicFrameElement(el));
     if (!magicFrameChildren.length) {
       if (source === "button") {
         this.setState({ errorMessage: "Cannot generate from an empty frame" });