diff --git a/theatre/studio/src/uiComponents/form/BasicNumberInput.tsx b/theatre/studio/src/uiComponents/form/BasicNumberInput.tsx index a814463..af4a86e 100644 --- a/theatre/studio/src/uiComponents/form/BasicNumberInput.tsx +++ b/theatre/studio/src/uiComponents/form/BasicNumberInput.tsx @@ -1,5 +1,6 @@ import {clamp, isInteger, round} from 'lodash-es' -import type {MutableRefObject} from 'react' +import type {MutableRefObject} from 'react'; +import { useEffect} from 'react' import {useState} from 'react' import React, {useMemo, useRef} from 'react' import styled from 'styled-components' @@ -279,6 +280,13 @@ const BasicNumberInput: React.FC<{ } }, []) + // Call onBlur on unmount. Because technically it _is_ a blur, but also, otherwise edits wouldn't be committed. + useEffect(() => { + return () => { + callbacks.onBlur() + } + }, []) + let value = stateRef.current.mode !== 'editingViaKeyboard' ? format(propsA.value) diff --git a/theatre/studio/src/uiComponents/form/BasicStringInput.tsx b/theatre/studio/src/uiComponents/form/BasicStringInput.tsx index be1a808..795e07e 100644 --- a/theatre/studio/src/uiComponents/form/BasicStringInput.tsx +++ b/theatre/studio/src/uiComponents/form/BasicStringInput.tsx @@ -1,5 +1,6 @@ import styled from 'styled-components' -import type {MutableRefObject} from 'react' +import type {MutableRefObject} from 'react'; +import { useEffect} from 'react' import React, {useMemo, useRef} from 'react' import mergeRefs from 'react-merge-refs' import useRefAndState from '@theatre/studio/utils/useRefAndState' @@ -169,6 +170,13 @@ const BasicStringInput: React.FC<{ } }, []) + // Call onBlur on unmount. Because technically it _is_ a blur, but also, otherwise edits wouldn't be committed. + useEffect(() => { + return () => { + callbacks.onBlur() + } + }, []) + let value = stateRef.current.mode !== 'editingViaKeyboard' ? format(props.value)