fix: allow input focus when readonly

[selfdocumentingcode]

Fixes #4992

Description

Input and Textarea fields cannot be focused if the readOnly prop is true.
This prevents the read-only fields from visually showing that they are focused and also makes them no longer emit focus and blur events.

This behavior is correct for fields with disabled attribute, but not for fields with readonly attribute.

The difference between disabled and readonly is that read-only controls can still function and are still focusable, whereas disabled controls can not receive focus and are not submitted with the form and generally do not function as controls until they are enabled.

https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly#attribute_interactions

Sandbox: https://codesandbox.io/s/base-web-input-forked-7f9vwc?file=/src/example.js

Scope

Patch: Bug Fix

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit e9e4adb:

Sandbox	Source
Basic usage	Configuration
Base Web - Input (forked)	PR
Base Web - Input (forked)	Issue #4992

[chasestarr]

Sorry to let this sit for a while. This change looks good to me, but we've converted over to typescript. Do you mind updating to that?

[selfdocumentingcode]

No worries. I will, but it'll have to be next week.

[selfdocumentingcode]

@chasestarr Hi. I updated the .tsx files.

[chasestarr]

Thank you