Spread Values Across a Pin Input Field in a Zag.js State Machine

The paste event is a unique input event that we need to handle. When we paste a value in from the clipboard, we need to split that value and input single characters to the individual inputs in our Pin Input.

To do this we will need to preventDefault in the onPaste event so that we can implement our custom logic here. Next we'll implement setPastedValue that splits and iterates over the input value we receive and sets it into context.

Finally we'll implement focusLastEmptyInput that looks up the index of the first empty value with findIndex and focuses that index.