expand board zoom & fixed embedshape focus on mobile

src/routes/Board.tsx

@@ -63,7 +63,26 @@ export function Board() {
         tools={tools}
         components={components}
         overrides={overrides}
-        //maxZoom={20}
+        cameraOptions={{
+          zoomSteps: [
+            0.001,  // Min zoom
+            0.0025,
+            0.005,
+            0.01,
+            0.025,
+            0.05,
+            0.1,
+            0.25,
+            0.5,
+            1,
+            2,
+            4,
+            8,
+            16,
+            32,
+            64     // Max zoom
+          ]
+        }}
         onMount={(editor) => {
           setEditor(editor)
           editor.registerExternalAssetHandler("url", unfurlBookmarkUrl)

src/shapes/EmbedShapeUtil.tsx

@@ -206,6 +206,14 @@ export class EmbedShape extends BaseBoxShapeUtil<IEmbedShape> {
           <div
             style={contentStyle}
             onClick={() => document.querySelector("input")?.focus()}
+            onPointerDown={(e) => {
+              e.preventDefault()
+              document.querySelector("input")?.focus()
+            }}
+            onTouchStart={(e) => {
+              e.preventDefault()
+              document.querySelector("input")?.focus()
+            }}
           >
             <form
               onSubmit={handleSubmit}
@@ -432,4 +440,42 @@ export class EmbedShape extends BaseBoxShapeUtil<IEmbedShape> {
       </div>
     )
   }
+
+  override onDoubleClick = (shape: IEmbedShape) => {
+    // If no URL is set, focus the input field
+    if (!shape.props.url) {
+      const input = document.querySelector('input')
+      input?.focus()
+      return
+    }
+
+    // For Medium articles and Twitter profiles that show alternative content
+    if (
+      shape.props.url.includes('medium.com') ||
+      (shape.props.url && shape.props.url.match(/(?:twitter\.com|x\.com)\/[^\/]+$/))
+    ) {
+      window.top?.open(shape.props.url, '_blank', 'noopener,noreferrer')
+      return
+    }
+
+    // For other embeds, enable interaction by temporarily removing pointer-events: none
+    const iframe = document.querySelector(`[data-shape-id="${shape.id}"] iframe`) as HTMLIFrameElement
+    if (iframe) {
+      iframe.style.pointerEvents = 'all'
+      // Reset pointer-events after interaction
+      const cleanup = () => {
+        iframe.style.pointerEvents = 'none'
+        window.removeEventListener('pointerdown', cleanup)
+      }
+      window.addEventListener('pointerdown', cleanup)
+    }
+  }
+
+  // Add new method to handle all pointer interactions
+  onPointerDown = (shape: IEmbedShape) => {
+    if (!shape.props.url) {
+      const input = document.querySelector('input')
+      input?.focus()
+    }
+  }
 }

src/ui/overrides.tsx

@@ -8,6 +8,7 @@ import {
 } from "./cameraUtils"
 import { saveToPdf } from "../utils/pdfUtils"
 import { searchText } from "../utils/searchUtils"
+import { EmbedShape, IEmbedShape } from "@/shapes/EmbedShapeUtil"
 
 export const overrides: TLUiOverrides = {
   tools(editor, tools) {
@@ -42,8 +43,13 @@ export const overrides: TLUiOverrides = {
 
         //TODO: Fix double click to zoom on selector tool later...
         onDoubleClick: (info: any) => {
-          // Prevent default double-click behavior (which would start text editing)
+          const shape = editor.getShapeAtPoint(info.point)
-          info.preventDefault?.()
+          if (shape?.type === 'Embed') {
+            // Let the Embed shape handle its own double-click behavior
+            const util = editor.getShapeUtil(shape) as EmbedShape
+            util?.onDoubleClick?.(shape as IEmbedShape)
+            return
+          }
           
           // Handle all pointer types (mouse, touch, pen)
           const point = info.point || (info.touches && info.touches[0]) || info