// Icon for toasts and dialogs: success, error, warning or info, drawn in currentColor.
const PATHS = {
	success: <path d="M7.5 12.5l3 3 6-6.5" />,
	error: <path d="M9 9l6 6M15 9l-6 6" />,
	warning: (
		<>
			<path d="M12 7.5v5.5" />
			<path d="M12 16.5h.01" />
		</>
	),
	info: (
		<>
			<path d="M12 11v5.5" />
			<path d="M12 7.5h.01" />
		</>
	),
};

const StatusIcon = ( { type = 'info', className = '' } ) => (
	<span className={ `ssgsw-status-icon ssgsw-status-icon--${ type } ${ className }`.trim() } aria-hidden="true">
		<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.2" strokeLinecap="round" strokeLinejoin="round">
			{ PATHS[ type ] || PATHS.info }
		</svg>
	</span>
);

export default StatusIcon;
