Fixes "done" key on iOS

This commit is contained in:
Steve Ruiz 2021-07-09 21:39:29 +01:00
parent 55ecec9e7b
commit bdcdb09162
2 changed files with 17 additions and 4 deletions

View file

@ -1,5 +1,5 @@
/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
import { MutableRefObject, useCallback } from 'react'
import { MutableRefObject, useCallback, useEffect } from 'react'
import state from 'state'
import {
fastBrushSelect,
@ -74,6 +74,19 @@ export default function useCanvasEvents(
// }
}, [])
// Send event on iOS when a user presses the "Done" key while editing a text element
useEffect(() => {
function handleFocusOut() {
state.send('BLURRED_EDITING_SHAPE')
}
document.addEventListener('focusout', handleFocusOut)
return () => {
document.removeEventListener('focusout', handleFocusOut)
}
}, [])
return {
onPointerDown: handlePointerDown,
onPointerMove: handlePointerMove,

View file

@ -679,8 +679,8 @@ const state = createState({
},
],
BLURRED_EDITING_SHAPE: [
{ unless: 'isEditingShape' },
{
unless: 'isEditingShape',
get: 'editingShape',
if: 'shouldDeleteShape',
do: ['cancelSession', 'deleteSelection'],
@ -688,8 +688,8 @@ const state = createState({
{ to: 'selecting' },
],
POINTED_CANVAS: [
{ unless: 'isEditingShape' },
{
unless: 'isEditingShape',
get: 'editingShape',
if: 'shouldDeleteShape',
do: ['cancelSession', 'deleteSelection'],
@ -697,8 +697,8 @@ const state = createState({
{ to: 'selecting' },
],
CANCELLED: [
{ unless: 'isEditingShape' },
{
unless: 'isEditingShape',
get: 'editingShape',
if: 'shouldDeleteShape',
do: ['cancelSession', 'deleteSelection'],