fix: selection rect should reflect viewport change (#12355)

Fixes [BS-3349](https://linear.app/affine-design/issue/BS-3349/)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
  - Improved edge scrolling during selection dragging for smoother and more responsive viewport navigation.
  - Dragging area and mouse position tracking now update reactively with viewport changes, ensuring more accurate selection and movement.

- **Refactor**
  - Unified and clarified coordinate handling for dragging and mouse position, with clearer naming and separation between model and browser coordinates.
  - Simplified selection logic and removed unnecessary accumulated state for cleaner and more maintainable behavior.
  - Enhanced flexibility in coordinate conversion by allowing viewport transformations relative to arbitrary zoom and center.
  - Streamlined clipboard paste handling by simplifying mouse position extraction and adjusting attachment options.

- **Bug Fixes**
  - Enhanced overlay and dragging area accuracy by updating position calculations and coordinate transformations.
  - Fixed paste operations to correctly handle mouse position without unnecessary coordinate conversions.
  - Corrected drag initiation positions in toolbar and shape dragging to align with viewport-relative coordinates.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

blocksuite/affine/blocks/root/src/edgeless/clipboard/clipboard.ts

@@ -209,9 +209,10 @@ export class EdgelessClipboardController extends PageClipboard {
         await addImages(this.std, imageFiles, {
           point,
           maxWidth: MAX_IMAGE_WIDTH,
+          shouldTransformPoint: false,
         });
       } else {
-        await addAttachments(this.std, [...files], point);
+        await addAttachments(this.std, [...files], point, false);
       }
 
       this.std.getOptional(TelemetryProvider)?.track('CanvasElementAdded', {
@@ -227,11 +228,7 @@ export class EdgelessClipboardController extends PageClipboard {
 
     if (isUrlInClipboard(data)) {
       const url = data.getData('text/plain');
-      const lastMousePos = this.toolManager.lastMousePos$.peek();
-      const [x, y] = this.gfx.viewport.toModelCoord(
-        lastMousePos.x,
-        lastMousePos.y
-      );
+      const { x, y } = this.toolManager.lastMousePos$.peek();
 
       // try to interpret url as affine doc url
       const parseDocUrlService = this.std.getOptional(ParseDocUrlProvider);
@@ -562,11 +559,7 @@ export class EdgelessClipboardController extends PageClipboard {
   }
 
   private async _pasteTextContentAsNote(content: BlockSnapshot[] | string) {
-    const lastMousePos = this.toolManager.lastMousePos$.peek();
-    const [x, y] = this.gfx.viewport.toModelCoord(
-      lastMousePos.x,
-      lastMousePos.y
-    );
+    const { x, y } = this.toolManager.lastMousePos$.peek();
 
     const noteProps = {
       xywh: new Bound(

blocksuite/affine/blocks/root/src/edgeless/clipboard/command.ts

@@ -52,9 +52,7 @@ export const createElementsFromClipboardDataCommand: Command<Input, Output> = (
     let oldCommonBound, pasteX, pasteY;
     {
       const lastMousePos = toolManager.lastMousePos$.peek();
-      pasteCenter =
-        pasteCenter ??
-        gfx.viewport.toModelCoord(lastMousePos.x, lastMousePos.y);
+      pasteCenter = pasteCenter ?? [lastMousePos.x, lastMousePos.y];
       const [modelX, modelY] = pasteCenter;
       oldCommonBound = edgelessElementsBoundFromRawData(elementsRawData);