tldraw 3.15.0-next.f1dfcef63951 → 3.16.0-next.c30b1b5e551a

package/dist-cjs/lib/canvas/TldrawSelectionForeground.js

@@ -137,277 +137,285 @@ const TldrawSelectionForeground = (0, import_editor.track)(function TldrawSelect
   }
   const textHandleHeight = Math.min(24 / zoom, height - targetSizeY * 3);
   const showTextResizeHandles = shouldDisplayControls && isCoarsePointer && onlyShape && editor.isShapeOfType(onlyShape, "text") && textHandleHeight * zoom >= 4;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "tl-overlays__item tl-selection__fg", "data-testid": "selection-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { ref: rSvg, children: [
-    shouldDisplayBox && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "rect",
-      {
-        className: "tl-selection__fg__outline",
-        width: (0, import_editor.toDomPrecision)(width),
-        height: (0, import_editor.toDomPrecision)(height)
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      RotateCornerHandle,
-      {
-        "data-testid": "selection.rotate.top-left",
-        cx: 0,
-        cy: 0,
-        targetSize,
-        corner: "top_left_rotate",
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("nwse-rotate", rotation) : void 0,
-        isHidden: hideRotateCornerHandles
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      RotateCornerHandle,
-      {
-        "data-testid": "selection.rotate.top-right",
-        cx: width + targetSize * 3,
-        cy: 0,
-        targetSize,
-        corner: "top_right_rotate",
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("nesw-rotate", rotation) : void 0,
-        isHidden: hideRotateCornerHandles
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      RotateCornerHandle,
-      {
-        "data-testid": "selection.rotate.bottom-left",
-        cx: 0,
-        cy: height + targetSize * 3,
-        targetSize,
-        corner: "bottom_left_rotate",
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("swne-rotate", rotation) : void 0,
-        isHidden: hideRotateCornerHandles
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      RotateCornerHandle,
-      {
-        "data-testid": "selection.rotate.bottom-right",
-        cx: width + targetSize * 3,
-        cy: height + targetSize * 3,
-        targetSize,
-        corner: "bottom_right_rotate",
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("senw-rotate", rotation) : void 0,
-        isHidden: hideRotateCornerHandles
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      MobileRotateHandle,
-      {
-        "data-testid": "selection.rotate.mobile",
-        cx: isSmallX ? -targetSize * 1.5 : width / 2,
-        cy: isSmallX ? height / 2 : -targetSize * 1.5,
-        size,
-        isHidden: hideMobileRotateHandle
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      ResizeHandle,
-      {
-        hide: hideVerticalEdgeTargets,
-        dataTestId: "selection.resize.top",
-        ariaLabel: msg("handle.resize-top"),
-        x: 0,
-        y: (0, import_editor.toDomPrecision)(0 - (isSmallY ? targetSizeY * 2 : targetSizeY)),
-        width: (0, import_editor.toDomPrecision)(width),
-        height: (0, import_editor.toDomPrecision)(Math.max(1, targetSizeY * 2)),
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("ns-resize", rotation) : void 0,
-        events: topEvents
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      ResizeHandle,
-      {
-        hide: hideHorizontalEdgeTargets,
-        dataTestId: "selection.resize.right",
-        ariaLabel: msg("handle.resize-right"),
-        x: (0, import_editor.toDomPrecision)(width - (isSmallX ? 0 : targetSizeX)),
-        y: 0,
-        height: (0, import_editor.toDomPrecision)(height),
-        width: (0, import_editor.toDomPrecision)(Math.max(1, targetSizeX * 2)),
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("ew-resize", rotation) : void 0,
-        events: rightEvents
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      ResizeHandle,
-      {
-        hide: hideVerticalEdgeTargets,
-        dataTestId: "selection.resize.bottom",
-        ariaLabel: msg("handle.resize-bottom"),
-        x: 0,
-        y: (0, import_editor.toDomPrecision)(height - (isSmallY ? 0 : targetSizeY)),
-        width: (0, import_editor.toDomPrecision)(width),
-        height: (0, import_editor.toDomPrecision)(Math.max(1, targetSizeY * 2)),
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("ns-resize", rotation) : void 0,
-        events: bottomEvents
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      ResizeHandle,
-      {
-        hide: hideHorizontalEdgeTargets,
-        dataTestId: "selection.resize.left",
-        ariaLabel: msg("handle.resize-left"),
-        x: (0, import_editor.toDomPrecision)(0 - (isSmallX ? targetSizeX * 2 : targetSizeX)),
-        y: 0,
-        height: (0, import_editor.toDomPrecision)(height),
-        width: (0, import_editor.toDomPrecision)(Math.max(1, targetSizeX * 2)),
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("ew-resize", rotation) : void 0,
-        events: leftEvents
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      ResizeHandle,
-      {
-        hide: hideTopLeftCorner,
-        dataTestId: "selection.target.top-left",
-        ariaLabel: msg("handle.resize-top-left"),
-        x: (0, import_editor.toDomPrecision)(0 - (isSmallX ? targetSizeX * 2 : targetSizeX * 1.5)),
-        y: (0, import_editor.toDomPrecision)(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5)),
-        width: (0, import_editor.toDomPrecision)(targetSizeX * 3),
-        height: (0, import_editor.toDomPrecision)(targetSizeY * 3),
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("nwse-resize", rotation) : void 0,
-        events: topLeftEvents
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      ResizeHandle,
-      {
-        hide: hideTopRightCorner,
-        dataTestId: "selection.target.top-right",
-        ariaLabel: msg("handle.resize-top-right"),
-        x: (0, import_editor.toDomPrecision)(width - (isSmallX ? 0 : targetSizeX * 1.5)),
-        y: (0, import_editor.toDomPrecision)(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5)),
-        width: (0, import_editor.toDomPrecision)(targetSizeX * 3),
-        height: (0, import_editor.toDomPrecision)(targetSizeY * 3),
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("nesw-resize", rotation) : void 0,
-        events: topRightEvents
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      ResizeHandle,
-      {
-        hide: hideBottomRightCorner,
-        dataTestId: "selection.target.bottom-right",
-        ariaLabel: msg("handle.resize-bottom-right"),
-        x: (0, import_editor.toDomPrecision)(width - (isSmallX ? targetSizeX : targetSizeX * 1.5)),
-        y: (0, import_editor.toDomPrecision)(height - (isSmallY ? targetSizeY : targetSizeY * 1.5)),
-        width: (0, import_editor.toDomPrecision)(targetSizeX * 3),
-        height: (0, import_editor.toDomPrecision)(targetSizeY * 3),
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("nwse-resize", rotation) : void 0,
-        events: bottomRightEvents
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      ResizeHandle,
-      {
-        hide: hideBottomLeftCorner,
-        dataTestId: "selection.target.bottom-left",
-        ariaLabel: msg("handle.resize-bottom-left"),
-        x: (0, import_editor.toDomPrecision)(0 - (isSmallX ? targetSizeX * 3 : targetSizeX * 1.5)),
-        y: (0, import_editor.toDomPrecision)(height - (isSmallY ? 0 : targetSizeY * 1.5)),
-        width: (0, import_editor.toDomPrecision)(targetSizeX * 3),
-        height: (0, import_editor.toDomPrecision)(targetSizeY * 3),
-        cursor: isDefaultCursor ? (0, import_editor.getCursor)("nesw-resize", rotation) : void 0,
-        events: bottomLeftEvents
-      }
-    ),
-    showResizeHandles && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "rect",
-        {
-          "data-testid": "selection.resize.top-left",
-          className: (0, import_classnames.default)("tl-corner-handle", {
-            "tl-hidden": hideTopLeftCorner
-          }),
-          x: (0, import_editor.toDomPrecision)(0 - size / 2),
-          y: (0, import_editor.toDomPrecision)(0 - size / 2),
-          width: (0, import_editor.toDomPrecision)(size),
-          height: (0, import_editor.toDomPrecision)(size)
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "rect",
-        {
-          "data-testid": "selection.resize.top-right",
-          className: (0, import_classnames.default)("tl-corner-handle", {
-            "tl-hidden": hideTopRightCorner
-          }),
-          x: (0, import_editor.toDomPrecision)(width - size / 2),
-          y: (0, import_editor.toDomPrecision)(0 - size / 2),
-          width: (0, import_editor.toDomPrecision)(size),
-          height: (0, import_editor.toDomPrecision)(size)
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "rect",
-        {
-          "data-testid": "selection.resize.bottom-right",
-          className: (0, import_classnames.default)("tl-corner-handle", {
-            "tl-hidden": hideBottomRightCorner
-          }),
-          x: (0, import_editor.toDomPrecision)(width - size / 2),
-          y: (0, import_editor.toDomPrecision)(height - size / 2),
-          width: (0, import_editor.toDomPrecision)(size),
-          height: (0, import_editor.toDomPrecision)(size)
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "rect",
-        {
-          "data-testid": "selection.resize.bottom-left",
-          className: (0, import_classnames.default)("tl-corner-handle", {
-            "tl-hidden": hideBottomLeftCorner
-          }),
-          x: (0, import_editor.toDomPrecision)(0 - size / 2),
-          y: (0, import_editor.toDomPrecision)(height - size / 2),
-          width: (0, import_editor.toDomPrecision)(size),
-          height: (0, import_editor.toDomPrecision)(size)
-        }
-      )
-    ] }),
-    showTextResizeHandles && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "rect",
-        {
-          "data-testid": "selection.text-resize.left.handle",
-          className: "tl-text-handle",
-          x: (0, import_editor.toDomPrecision)(0 - size / 4),
-          y: (0, import_editor.toDomPrecision)(height / 2 - textHandleHeight / 2),
-          rx: size / 4,
-          width: (0, import_editor.toDomPrecision)(size / 2),
-          height: (0, import_editor.toDomPrecision)(textHandleHeight)
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "rect",
-        {
-          "data-testid": "selection.text-resize.right.handle",
-          className: "tl-text-handle",
-          rx: size / 4,
-          x: (0, import_editor.toDomPrecision)(width - size / 4),
-          y: (0, import_editor.toDomPrecision)(height / 2 - textHandleHeight / 2),
-          width: (0, import_editor.toDomPrecision)(size / 2),
-          height: (0, import_editor.toDomPrecision)(textHandleHeight)
-        }
-      )
-    ] }),
-    showCropHandles && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_TldrawCropHandles.TldrawCropHandles,
-      {
-        ...{
-          size,
-          width,
-          height,
-          hideAlternateHandles: hideAlternateCropHandles
-        }
-      }
-    )
-  ] }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "svg",
+    {
+      className: "tl-overlays__item tl-selection__fg",
+      "data-testid": "selection-foreground",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { ref: rSvg, children: [
+        shouldDisplayBox && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "rect",
+          {
+            className: "tl-selection__fg__outline",
+            width: (0, import_editor.toDomPrecision)(width),
+            height: (0, import_editor.toDomPrecision)(height)
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          RotateCornerHandle,
+          {
+            "data-testid": "selection.rotate.top-left",
+            cx: 0,
+            cy: 0,
+            targetSize,
+            corner: "top_left_rotate",
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("nwse-rotate", rotation) : void 0,
+            isHidden: hideRotateCornerHandles
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          RotateCornerHandle,
+          {
+            "data-testid": "selection.rotate.top-right",
+            cx: width + targetSize * 3,
+            cy: 0,
+            targetSize,
+            corner: "top_right_rotate",
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("nesw-rotate", rotation) : void 0,
+            isHidden: hideRotateCornerHandles
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          RotateCornerHandle,
+          {
+            "data-testid": "selection.rotate.bottom-left",
+            cx: 0,
+            cy: height + targetSize * 3,
+            targetSize,
+            corner: "bottom_left_rotate",
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("swne-rotate", rotation) : void 0,
+            isHidden: hideRotateCornerHandles
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          RotateCornerHandle,
+          {
+            "data-testid": "selection.rotate.bottom-right",
+            cx: width + targetSize * 3,
+            cy: height + targetSize * 3,
+            targetSize,
+            corner: "bottom_right_rotate",
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("senw-rotate", rotation) : void 0,
+            isHidden: hideRotateCornerHandles
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          MobileRotateHandle,
+          {
+            "data-testid": "selection.rotate.mobile",
+            cx: isSmallX ? -targetSize * 1.5 : width / 2,
+            cy: isSmallX ? height / 2 : -targetSize * 1.5,
+            size,
+            isHidden: hideMobileRotateHandle
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ResizeHandle,
+          {
+            hide: hideVerticalEdgeTargets,
+            dataTestId: "selection.resize.top",
+            ariaLabel: msg("handle.resize-top"),
+            x: 0,
+            y: (0, import_editor.toDomPrecision)(0 - (isSmallY ? targetSizeY * 2 : targetSizeY)),
+            width: (0, import_editor.toDomPrecision)(width),
+            height: (0, import_editor.toDomPrecision)(Math.max(1, targetSizeY * 2)),
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("ns-resize", rotation) : void 0,
+            events: topEvents
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ResizeHandle,
+          {
+            hide: hideHorizontalEdgeTargets,
+            dataTestId: "selection.resize.right",
+            ariaLabel: msg("handle.resize-right"),
+            x: (0, import_editor.toDomPrecision)(width - (isSmallX ? 0 : targetSizeX)),
+            y: 0,
+            height: (0, import_editor.toDomPrecision)(height),
+            width: (0, import_editor.toDomPrecision)(Math.max(1, targetSizeX * 2)),
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("ew-resize", rotation) : void 0,
+            events: rightEvents
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ResizeHandle,
+          {
+            hide: hideVerticalEdgeTargets,
+            dataTestId: "selection.resize.bottom",
+            ariaLabel: msg("handle.resize-bottom"),
+            x: 0,
+            y: (0, import_editor.toDomPrecision)(height - (isSmallY ? 0 : targetSizeY)),
+            width: (0, import_editor.toDomPrecision)(width),
+            height: (0, import_editor.toDomPrecision)(Math.max(1, targetSizeY * 2)),
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("ns-resize", rotation) : void 0,
+            events: bottomEvents
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ResizeHandle,
+          {
+            hide: hideHorizontalEdgeTargets,
+            dataTestId: "selection.resize.left",
+            ariaLabel: msg("handle.resize-left"),
+            x: (0, import_editor.toDomPrecision)(0 - (isSmallX ? targetSizeX * 2 : targetSizeX)),
+            y: 0,
+            height: (0, import_editor.toDomPrecision)(height),
+            width: (0, import_editor.toDomPrecision)(Math.max(1, targetSizeX * 2)),
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("ew-resize", rotation) : void 0,
+            events: leftEvents
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ResizeHandle,
+          {
+            hide: hideTopLeftCorner,
+            dataTestId: "selection.target.top-left",
+            ariaLabel: msg("handle.resize-top-left"),
+            x: (0, import_editor.toDomPrecision)(0 - (isSmallX ? targetSizeX * 2 : targetSizeX * 1.5)),
+            y: (0, import_editor.toDomPrecision)(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5)),
+            width: (0, import_editor.toDomPrecision)(targetSizeX * 3),
+            height: (0, import_editor.toDomPrecision)(targetSizeY * 3),
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("nwse-resize", rotation) : void 0,
+            events: topLeftEvents
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ResizeHandle,
+          {
+            hide: hideTopRightCorner,
+            dataTestId: "selection.target.top-right",
+            ariaLabel: msg("handle.resize-top-right"),
+            x: (0, import_editor.toDomPrecision)(width - (isSmallX ? 0 : targetSizeX * 1.5)),
+            y: (0, import_editor.toDomPrecision)(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5)),
+            width: (0, import_editor.toDomPrecision)(targetSizeX * 3),
+            height: (0, import_editor.toDomPrecision)(targetSizeY * 3),
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("nesw-resize", rotation) : void 0,
+            events: topRightEvents
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ResizeHandle,
+          {
+            hide: hideBottomRightCorner,
+            dataTestId: "selection.target.bottom-right",
+            ariaLabel: msg("handle.resize-bottom-right"),
+            x: (0, import_editor.toDomPrecision)(width - (isSmallX ? targetSizeX : targetSizeX * 1.5)),
+            y: (0, import_editor.toDomPrecision)(height - (isSmallY ? targetSizeY : targetSizeY * 1.5)),
+            width: (0, import_editor.toDomPrecision)(targetSizeX * 3),
+            height: (0, import_editor.toDomPrecision)(targetSizeY * 3),
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("nwse-resize", rotation) : void 0,
+            events: bottomRightEvents
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ResizeHandle,
+          {
+            hide: hideBottomLeftCorner,
+            dataTestId: "selection.target.bottom-left",
+            ariaLabel: msg("handle.resize-bottom-left"),
+            x: (0, import_editor.toDomPrecision)(0 - (isSmallX ? targetSizeX * 3 : targetSizeX * 1.5)),
+            y: (0, import_editor.toDomPrecision)(height - (isSmallY ? 0 : targetSizeY * 1.5)),
+            width: (0, import_editor.toDomPrecision)(targetSizeX * 3),
+            height: (0, import_editor.toDomPrecision)(targetSizeY * 3),
+            cursor: isDefaultCursor ? (0, import_editor.getCursor)("nesw-resize", rotation) : void 0,
+            events: bottomLeftEvents
+          }
+        ),
+        showResizeHandles && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "rect",
+            {
+              "data-testid": "selection.resize.top-left",
+              className: (0, import_classnames.default)("tl-corner-handle", {
+                "tl-hidden": hideTopLeftCorner
+              }),
+              x: (0, import_editor.toDomPrecision)(0 - size / 2),
+              y: (0, import_editor.toDomPrecision)(0 - size / 2),
+              width: (0, import_editor.toDomPrecision)(size),
+              height: (0, import_editor.toDomPrecision)(size)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "rect",
+            {
+              "data-testid": "selection.resize.top-right",
+              className: (0, import_classnames.default)("tl-corner-handle", {
+                "tl-hidden": hideTopRightCorner
+              }),
+              x: (0, import_editor.toDomPrecision)(width - size / 2),
+              y: (0, import_editor.toDomPrecision)(0 - size / 2),
+              width: (0, import_editor.toDomPrecision)(size),
+              height: (0, import_editor.toDomPrecision)(size)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "rect",
+            {
+              "data-testid": "selection.resize.bottom-right",
+              className: (0, import_classnames.default)("tl-corner-handle", {
+                "tl-hidden": hideBottomRightCorner
+              }),
+              x: (0, import_editor.toDomPrecision)(width - size / 2),
+              y: (0, import_editor.toDomPrecision)(height - size / 2),
+              width: (0, import_editor.toDomPrecision)(size),
+              height: (0, import_editor.toDomPrecision)(size)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "rect",
+            {
+              "data-testid": "selection.resize.bottom-left",
+              className: (0, import_classnames.default)("tl-corner-handle", {
+                "tl-hidden": hideBottomLeftCorner
+              }),
+              x: (0, import_editor.toDomPrecision)(0 - size / 2),
+              y: (0, import_editor.toDomPrecision)(height - size / 2),
+              width: (0, import_editor.toDomPrecision)(size),
+              height: (0, import_editor.toDomPrecision)(size)
+            }
+          )
+        ] }),
+        showTextResizeHandles && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "rect",
+            {
+              "data-testid": "selection.text-resize.left.handle",
+              className: "tl-text-handle",
+              x: (0, import_editor.toDomPrecision)(0 - size / 4),
+              y: (0, import_editor.toDomPrecision)(height / 2 - textHandleHeight / 2),
+              rx: size / 4,
+              width: (0, import_editor.toDomPrecision)(size / 2),
+              height: (0, import_editor.toDomPrecision)(textHandleHeight)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "rect",
+            {
+              "data-testid": "selection.text-resize.right.handle",
+              className: "tl-text-handle",
+              rx: size / 4,
+              x: (0, import_editor.toDomPrecision)(width - size / 4),
+              y: (0, import_editor.toDomPrecision)(height / 2 - textHandleHeight / 2),
+              width: (0, import_editor.toDomPrecision)(size / 2),
+              height: (0, import_editor.toDomPrecision)(textHandleHeight)
+            }
+          )
+        ] }),
+        showCropHandles && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_TldrawCropHandles.TldrawCropHandles,
+          {
+            ...{
+              size,
+              width,
+              height,
+              hideAlternateHandles: hideAlternateCropHandles
+            }
+          }
+        )
+      ] })
+    }
+  );
 });
 const ResizeHandle = function ResizeHandle2({
   hide,