[Authenticator] Improve code entry UX

[mattcreaser]

Before opening, please confirm:

• I have searched for duplicate or closed issues.

Which UI component is this feature-request for?

Authenticator

Please include any relevant guides or documentation you're referencing

No response

Please describe your feature-request in detail.

Authenticator currently uses a plain text box for collecting confirmation codes, such as if a user has SMS MFA enabled, or for collecting email validations post-signup.

This works fine but it isn't very nice looking. Most code collection UIs use discrete boxes to collect the code, similar to the following image:

This feature request proposes introducing a new type of input FieldConfig.Code specifically for collecting validation codes that will implement a UI similar to to the above.

Initialization steps (if applicable)

No response

Code Snippet

// Put your code below this line.

amplifyconfiguration.json

No response

Additional information and screenshots

No response

[github-actions]

This issue was opened by a maintainer of this repository; updates will be posted here. If you are also experiencing this issue, please comment here with any relevant information so that we're aware and can prioritize accordingly.