Add readonly & required data attributes to <TextField />

[sookmax]

Closes #5930

✅ Pull Request Checklist:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
• Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

Docs

http://localhost:1234/react-aria/TextField.html#textfield-2

🧢 Your Project:

[reidbarber]

GET_BUILD

[stefanprobst]

thanks! should we add these to NumberField/DateField/Select as well?

[rspbot]

Build successful! 🎉

• View the storybook
• View the storybook-17
• View the storybook-16
• View the documentation

[rspbot]

## API Changes

unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any', access: 'private' }
unknown top level export { type: 'any', access: 'private' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'identifier', name: 'Column' }
unknown top level export { type: 'identifier', name: 'Column' }
unknown type { type: 'link' }
unknown type { type: 'link' }
unknown type { type: 'link' }
unknown type { type: 'link' }
unknown type { type: 'link' }
unknown type { type: 'link' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }
unknown top level export { type: 'any' }

[snowystinger]

These seem like they should be renderProps for the Input as well. Thoughts?

If we want to do that, it can be in a separate PR

[sookmax]

@snowystinger Not sure if <Input /> can be used standalone, but I found the following test in TextField.test.js:

react-spectrum/packages/react-aria-components/test/TextField.test.js

Lines 137 to 142 in 3492443

	it('should render data- attributes only on the outer element', () => {
	let {getAllByTestId} = render(<TestTextField input={component} />);
	let outerEl = getAllByTestId('text-field-test');
	expect(outerEl).toHaveLength(1);
	expect(outerEl[0]).toHaveClass('react-aria-TextField');
	});

Title of which, by the way, doesn't seem to match what it is testing?