(
e: KeyboardEvent<HTMLInputElement>,
index: number,
)
| 65 | }; |
| 66 | |
| 67 | const onKeyDown = async ( |
| 68 | e: KeyboardEvent<HTMLInputElement>, |
| 69 | index: number, |
| 70 | ) => { |
| 71 | const { key } = e; |
| 72 | const isNumbersOnly = checkIsNumbersOnly(key); |
| 73 | |
| 74 | if ((e.ctrlKey || e.metaKey) && key === 'v') { |
| 75 | return; |
| 76 | } |
| 77 | |
| 78 | if (key === KeyboardCommand.Enter) { |
| 79 | onSubmit(code.join('')); |
| 80 | return; |
| 81 | } |
| 82 | |
| 83 | if (INVALID_KEYS.includes(key)) { |
| 84 | e.preventDefault(); |
| 85 | } |
| 86 | |
| 87 | if (key === KeyboardCommand.Backspace) { |
| 88 | updateCode('', index); |
| 89 | |
| 90 | if (index <= 0) { |
| 91 | return; |
| 92 | } |
| 93 | |
| 94 | const previous = index - 1; |
| 95 | |
| 96 | if (elementsRef.current[previous]) { |
| 97 | await nextTick(); |
| 98 | elementsRef.current[previous].focus(); |
| 99 | } |
| 100 | } |
| 101 | |
| 102 | if (!isNumbersOnly) { |
| 103 | e.preventDefault(); |
| 104 | } else if (key.length === 1) { |
| 105 | e.preventDefault(); |
| 106 | updateCode(key, index); |
| 107 | |
| 108 | if (index < length - 1) { |
| 109 | const nextIndex = index + 1; |
| 110 | |
| 111 | if (elementsRef.current[nextIndex]) { |
| 112 | await nextTick(); |
| 113 | elementsRef.current[nextIndex].focus(); |
| 114 | } |
| 115 | } |
| 116 | } |
| 117 | }; |
| 118 | |
| 119 | return ( |
| 120 | <span className="flex flex-row gap-2"> |
no test coverage detected