import { ComboboxControl } from '@wordpress/components';

/**
 * Single-choice field rendered as a searchable combobox (type to filter).
 * Options are { value, label }. Empty selection resolves to ''.
 */
const SelectField = ( { field, value, onChange } ) => (
	<div className="cliqthemes-ui-select-field">
		<ComboboxControl
			__next40pxDefaultSize
			__nextHasNoMarginBottom
			label={ field.label }
			value={ value ?? field.default ?? '' }
			options={ field.options ?? [] }
			onChange={ ( next ) => onChange( next ?? '' ) }
			help={ field.help }
			allowReset={ ! field.required }
		/>
	</div>
);

export default SelectField;
