---
import type { FormControl } from '../core/form-control';

export interface Props {
	control: FormControl;
}

const { control } = Astro.props;
---

<div>
	{
		control.label && control.labelPosition === 'left' && (
			<label for={control.name}>{control.label}</label>
		)
	}

	<input
		name={control.name}
		id={control.name}
		type={control.type}
		value={control.value}
		checked={control.value === 'checked'}
		placeholder={control.placeholder}
		data-label={control.label}
		data-label-position={control.labelPosition}
	/>

	{
		control.label && control.labelPosition === 'right' && (
			<label for={control.name}>{control.label}</label>
		)
	}
</div>
