JSFiddle - React, Tailwind, and code Playground

JavaScript

const { InspectorControls, RichText } = wp.blockEditor;
const { registerBlockType } = wp.blocks;
const { __experimentalInputControl: InputControl } = wp.components;
const { Fragment } = wp.element;

registerBlockType('my-blocks/test', {
	title: 'Test',
	description: 'Test Block',
	attributes: {
		urlNew: {
			type: 'string',
			default: '',
		},
		text: {
			type: 'string',
			default: '',
		},
	},

	edit(props) {
		const { attributes, className, setAttributes } = props;
		const { urlNew, text } = attributes;

		return (
			<Fragment>
				<InspectorControls>
					<InputControl label="URL" value={urlNew} onChange={urlNew => setAttributes({ urlNew })} />
				</InspectorControls>
				<RichText
					tagName="div"
					className={className}
					value={text}
					placeholder="Link text"
					onChange={text => setAttributes({ text })}
				/>
			</Fragment>
		);
	},

	save(props) {
		const {
			attributes: { urlNew, text },
		} = props;

		return <a href={urlNew}>{text}</a>;
	},

	deprecated: [
		{
			url: {
				type: 'string',
				source: 'attribute',
				selector: 'a',
				attribute: 'href',
			},

			migrate({ url }) {
				return {
					urlNew: url,
				};
			},

			save(props) {
				const {
					attributes: { url, text },
				} = props;

				return <a href={url}>{text}</a>;
			},
		},
	],
});