diff --git a/tldraw/apps/tldraw-logseq/src/components/icons/LogseqIcon.tsx b/tldraw/apps/tldraw-logseq/src/components/icons/LogseqIcon.tsx index 45d417e2fe..eb5f09f744 100644 --- a/tldraw/apps/tldraw-logseq/src/components/icons/LogseqIcon.tsx +++ b/tldraw/apps/tldraw-logseq/src/components/icons/LogseqIcon.tsx @@ -6,7 +6,7 @@ const iconBase64 = export function LogseqIcon() { return ( logseq diff --git a/tldraw/packages/core/src/lib/tools/TLSelectTool/states/PointingCanvasState.ts b/tldraw/packages/core/src/lib/tools/TLSelectTool/states/PointingCanvasState.ts index 9051a0cdd6..62c8f4a527 100644 --- a/tldraw/packages/core/src/lib/tools/TLSelectTool/states/PointingCanvasState.ts +++ b/tldraw/packages/core/src/lib/tools/TLSelectTool/states/PointingCanvasState.ts @@ -39,4 +39,8 @@ export class PointingCanvasState< onPinchStart: TLEvents['pinch'] = (info, event) => { this.tool.transition('pinching', { info, event }) } + + onDoubleClick: TLEvents['pointer'] = info => { + console.log('TODO: bringing up Logseq autocomplete here', info) + } } diff --git a/tldraw/packages/react/src/hooks/useCanvasEvents.ts b/tldraw/packages/react/src/hooks/useCanvasEvents.ts index c9b44a0a89..8429bcf6ff 100644 --- a/tldraw/packages/react/src/hooks/useCanvasEvents.ts +++ b/tldraw/packages/react/src/hooks/useCanvasEvents.ts @@ -3,11 +3,14 @@ import { useRendererContext } from '~hooks' import { TLTargetType } from '@tldraw/core' import type { TLReactCustomEvents } from '~types' import { useApp } from './useApp' +import { DOUBLE_CLICK_DURATION } from '~constants' export function useCanvasEvents() { const app = useApp() const { callbacks } = useRendererContext() + const rDoubleClickTimer = React.useRef(-1) + const events = React.useMemo(() => { const onPointerMove: TLReactCustomEvents['pointer'] = e => { const { order = 0 } = e @@ -18,6 +21,17 @@ export function useCanvasEvents() { const { order = 0 } = e if (!order) e.currentTarget?.setPointerCapture(e.pointerId) callbacks.onPointerDown?.({ type: TLTargetType.Canvas, order }, e) + + const now = Date.now() + const elapsed = now - rDoubleClickTimer.current + if (elapsed > DOUBLE_CLICK_DURATION) { + rDoubleClickTimer.current = now + } else { + if (elapsed <= DOUBLE_CLICK_DURATION) { + callbacks.onDoubleClick?.({ type: TLTargetType.Canvas, order }, e) + rDoubleClickTimer.current = -1 + } + } } const onPointerUp: TLReactCustomEvents['pointer'] = e => {