@nous-excalidraw/excalidraw 0.18.9-beta.2 → 0.18.9-beta.3

package/dist/dev/index.js

@@ -119,6 +119,7 @@ import {
   KEYS as KEYS55,
   APP_NAME as APP_NAME2,
   CURSOR_TYPE as CURSOR_TYPE4,
+  DEFAULT_TRANSFORM_HANDLE_SPACING as DEFAULT_TRANSFORM_HANDLE_SPACING3,
   DEFAULT_MAX_IMAGE_WIDTH_OR_HEIGHT,
   DEFAULT_VERTICAL_ALIGN,
   DRAGGING_THRESHOLD as DRAGGING_THRESHOLD3,
@@ -204,7 +205,6 @@ import {
 import {
   getObservedAppState,
   getCommonBounds as getCommonBounds11,
-  getCommonSelectionBounds as getCommonSelectionBounds2,
   getElementAbsoluteCoords as getElementAbsoluteCoords9,
   bindOrUnbindBindingElements as bindOrUnbindBindingElements2,
   fixBindingsAfterDeletion as fixBindingsAfterDeletion2,
@@ -19345,7 +19345,7 @@ import {
 } from "@nous-excalidraw/math";
 
 // ../element/src/frame.ts
-import { arrayToMap as arrayToMap19, sizeOf as sizeOf2 } from "@nous-excalidraw/common";
+import { arrayToMap as arrayToMap19 } from "@nous-excalidraw/common";
 import { isPointWithinBounds as isPointWithinBounds2, pointFrom as pointFrom16 } from "@nous-excalidraw/math";
 
 // ../utils/src/bbox.ts
@@ -35156,6 +35156,7 @@ import {
 import {
   arrayToMap as arrayToMap26,
   BIND_MODE_TIMEOUT,
+  DEFAULT_TRANSFORM_HANDLE_SPACING as DEFAULT_TRANSFORM_HANDLE_SPACING2,
   FRAME_STYLE as FRAME_STYLE3,
   getFontString as getFontString11,
   getFeatureFlag as getFeatureFlag3,
@@ -35199,12 +35200,7 @@ import {
   isSelectedViaGroup,
   selectGroupsFromGivenElements as selectGroupsFromGivenElements3
 } from "@nous-excalidraw/element";
-import {
-  getCommonBounds as getCommonBounds9,
-  getCommonSelectionBounds,
-  getElementAbsoluteCoords as getElementAbsoluteCoords7,
-  getElementSelectionCoords
-} from "@nous-excalidraw/element";
+import { getCommonBounds as getCommonBounds9, getElementAbsoluteCoords as getElementAbsoluteCoords7 } from "@nous-excalidraw/element";
 import {
   getGlobalFixedPointForBindableElement as getGlobalFixedPointForBindableElement2,
   isFocusPointVisible
@@ -35959,7 +35955,7 @@ var renderSelectionBorder = (context, appState, elementProperties) => {
   } = elementProperties;
   const elementWidth = x2 - x1;
   const elementHeight = y2 - y1;
-  const padding = elementProperties.padding ?? 0;
+  const padding = elementProperties.padding ?? DEFAULT_TRANSFORM_HANDLE_SPACING2 * 2;
   const linePadding = padding / appState.zoom.value;
   const lineWidth = 8 / appState.zoom.value;
   const spaceWidth = 4 / appState.zoom.value;
@@ -36034,9 +36030,10 @@ var getTextHoverUnderlineLocalY = (element, zoom) => {
 var renderHoverOutlineElement = (context, appState, element, elementsMap) => {
   const hoverStrokePx = isFrameLikeElement14(element) ? HOVER_OUTLINE_STROKE_PX_FRAME : HOVER_OUTLINE_STROKE_PX_OTHER;
   const lineWidthScene = hoverStrokePx / appState.zoom.value;
-  const [x1, y1, x2, y2, cx, cy] = getElementSelectionCoords(
+  const [x1, y1, x2, y2, cx, cy] = getElementAbsoluteCoords7(
     element,
-    elementsMap
+    elementsMap,
+    true
   );
   const width = x2 - x1;
   const height = y2 - y1;
@@ -36208,9 +36205,10 @@ var buildElementSelectionBorders = ({
       }
     }
     if (selectionColors.length) {
-      const [x1, y1, x2, y2, cx, cy] = getElementSelectionCoords(
+      const [x1, y1, x2, y2, cx, cy] = getElementAbsoluteCoords7(
         element,
-        elementsMap
+        elementsMap,
+        true
       );
       selections.push({
         angle: element.angle,
@@ -36223,16 +36221,13 @@ var buildElementSelectionBorders = ({
         cx,
         cy,
         activeEmbeddable: !isEmbeddableElement4(element) && appState.activeEmbeddable?.element === element && appState.activeEmbeddable.state === "active",
-        padding: 0
+        padding: element.id === appState.croppingElementId || isImageElement8(element) || isFrameLikeElement14(element) ? 0 : void 0
       });
     }
   }
   const addSelectionForGroupId = (groupId) => {
     const groupElements = getElementsInGroup8(elementsMap, groupId);
-    const [x1, y1, x2, y2] = getCommonSelectionBounds(
-      groupElements,
-      elementsMap
-    );
+    const [x1, y1, x2, y2] = getCommonBounds9(groupElements);
     selections.push({
       angle: 0,
       x1,
@@ -36243,8 +36238,7 @@ var buildElementSelectionBorders = ({
       dashed: true,
       cx: x1 + (x2 - x1) / 2,
       cy: y1 + (y2 - y1) / 2,
-      activeEmbeddable: false,
-      padding: 0
+      activeEmbeddable: false
     });
   };
   for (const groupId of getSelectedGroupIds3(appState)) {
@@ -36957,11 +36951,9 @@ var _renderInteractiveScene = ({
         }
       }
     } else if (selectedElements.length > 1 && !appState.isRotating && !selectedElements.some((el) => el.locked)) {
+      const dashedLinePadding = DEFAULT_TRANSFORM_HANDLE_SPACING2 * 2 / appState.zoom.value;
       context.fillStyle = "#fff";
-      const [x1, y1, x2, y2] = getCommonSelectionBounds(
-        selectedElements,
-        elementsMap
-      );
+      const [x1, y1, x2, y2] = getCommonBounds9(selectedElements, elementsMap);
       const initialLineDash = context.getLineDash();
       context.setLineDash([2 / appState.zoom.value]);
       const lineWidth = context.lineWidth;
@@ -36969,10 +36961,10 @@ var _renderInteractiveScene = ({
       context.strokeStyle = selectionColor;
       strokeRectWithRotation_simple(
         context,
-        x1,
-        y1,
-        x2 - x1,
-        y2 - y1,
+        x1 - dashedLinePadding,
+        y1 - dashedLinePadding,
+        x2 - x1 + dashedLinePadding * 2,
+        y2 - y1 + dashedLinePadding * 2,
         (x1 + x2) / 2,
         (y1 + y2) / 2,
         0
@@ -45390,11 +45382,9 @@ var App = class _App extends React46.Component {
       DEFAULT_COLLISION_THRESHOLD / this.state.zoom.value,
       1
     );
-    const [x1, y1, x2, y2] = getCommonSelectionBounds2(
-      selectedElements,
-      this.scene.getNonDeletedElementsMap()
-    );
-    return point.x > x1 - threshold && point.x < x2 + threshold && point.y > y1 - threshold && point.y < y2 + threshold;
+    const boundsPadding = DEFAULT_TRANSFORM_HANDLE_SPACING3 * 2 / this.state.zoom.value;
+    const [x1, y1, x2, y2] = getCommonBounds11(selectedElements);
+    return point.x > x1 - boundsPadding - threshold && point.x < x2 + boundsPadding + threshold && point.y > y1 - boundsPadding - threshold && point.y < y2 + boundsPadding + threshold;
   }
   getCurrentItemRoundness(elementType) {
     return this.state.currentItemRoundness === "round" ? {