import { __ } from '@wordpress/i18n';

export default function Stepper( { value, min = 0, max = 999, step = 1, onChange } ) {
	const num = Number( value ) || 0;
	const clamp = ( n ) => Math.max( min, Math.min( max, n ) );
	return (
		<div className="edfw-stepper">
			<button
				type="button"
				className="edfw-stepper__btn"
				aria-label={ __( 'Decrease', 'wpactpro-estimated-delivery-date' ) }
				onClick={ () => onChange( clamp( num - step ) ) }
			>
				−
			</button>
			<div className="edfw-stepper__val">{ num }</div>
			<button
				type="button"
				className="edfw-stepper__btn"
				aria-label={ __( 'Increase', 'wpactpro-estimated-delivery-date' ) }
				onClick={ () => onChange( clamp( num + step ) ) }
			>
				+
			</button>
		</div>
	);
}
