mirror of
https://github.com/cpvalente/ontime.git
synced 2026-08-14 20:03:52 +00:00
fix(cuesheet): prevent timer cells from submitting on tab-out or escape (#2083)
This commit is contained in:
+6
@@ -49,6 +49,10 @@ function DurationInput({
|
||||
setIsEditing(false);
|
||||
setTimeout(() => textRef.current?.focusParentElement()); // Immediate timeout to ensure state change takes place first
|
||||
};
|
||||
const handleTabOut = useCallback(() => {
|
||||
setIsEditing(false);
|
||||
// Tab moves focus naturally; do not steal it back to parent
|
||||
}, []);
|
||||
|
||||
const handleUpdate = useCallback(
|
||||
(newValue: string) => {
|
||||
@@ -95,8 +99,10 @@ function DurationInput({
|
||||
ref={inputRef}
|
||||
initialValue={timeString}
|
||||
allowSubmitSameValue={!lockedValue} // if the value is not locked, submitting will lock the value
|
||||
submitOnTab={false}
|
||||
handleUpdate={handleUpdate}
|
||||
handleCancelUpdate={handleFakeBlur}
|
||||
handleTabCancel={handleTabOut}
|
||||
/>
|
||||
) : (
|
||||
<TextLikeInput
|
||||
|
||||
+14
-1
@@ -8,13 +8,24 @@ interface SingleLineCellProps {
|
||||
fieldId?: string;
|
||||
fieldLabel?: string;
|
||||
allowSubmitSameValue?: boolean;
|
||||
submitOnTab?: boolean;
|
||||
handleUpdate: (newValue: string) => void;
|
||||
handleCancelUpdate?: () => void;
|
||||
handleTabCancel?: () => void;
|
||||
}
|
||||
|
||||
const SingleLineCell = forwardRef(
|
||||
(
|
||||
{ initialValue, fieldId, fieldLabel, allowSubmitSameValue, handleUpdate, handleCancelUpdate }: SingleLineCellProps,
|
||||
{
|
||||
initialValue,
|
||||
fieldId,
|
||||
fieldLabel,
|
||||
allowSubmitSameValue,
|
||||
submitOnTab,
|
||||
handleUpdate,
|
||||
handleCancelUpdate,
|
||||
handleTabCancel,
|
||||
}: SingleLineCellProps,
|
||||
inputRef,
|
||||
) => {
|
||||
const ref = useRef<HTMLInputElement | null>(null);
|
||||
@@ -25,7 +36,9 @@ const SingleLineCell = forwardRef(
|
||||
allowKeyboardNavigation: true,
|
||||
submitOnEnter: true, // single line should submit on enter
|
||||
submitOnCtrlEnter: true,
|
||||
submitOnTab,
|
||||
onCancelUpdate: handleCancelUpdate,
|
||||
onTabCancel: handleTabCancel,
|
||||
});
|
||||
|
||||
// expose a subset of the methods to the parent
|
||||
|
||||
@@ -50,6 +50,10 @@ function TimeInputDuration({
|
||||
setIsEditing(false);
|
||||
setTimeout(() => textRef.current?.focusParentElement()); // Immediate timeout to ensure state change takes place first
|
||||
};
|
||||
const handleTabOut = useCallback(() => {
|
||||
setIsEditing(false);
|
||||
// Tab moves focus naturally; do not steal it back to parent
|
||||
}, []);
|
||||
|
||||
const handleUpdate = useCallback(
|
||||
(newValue: string) => {
|
||||
@@ -96,8 +100,10 @@ function TimeInputDuration({
|
||||
ref={inputRef}
|
||||
initialValue={timeString}
|
||||
allowSubmitSameValue={!lockedValue} // if the value is not locked, submitting will lock the value
|
||||
submitOnTab={false}
|
||||
handleUpdate={handleUpdate}
|
||||
handleCancelUpdate={handleFakeBlur}
|
||||
handleTabCancel={handleTabOut}
|
||||
/>
|
||||
) : (
|
||||
<TextLikeInput
|
||||
|
||||
Reference in New Issue
Block a user