/** 화면 우하단 탐색 막대 (줌 표시·전체 보기) */
import type { FC } from 'react';
import { runCommandInput } from '../commands/run-command';
import { getScreenCanvasDrawController } from '../state';

export const ViewControls: FC = () => {
	const zoom = getScreenCanvasDrawController()?.getScreenScale() ?? 1;

	return (
		<div className="cad-view-controls controls">
			<button
				type="button"
				className="cad-view-controls__fit"
				onClick={() => runCommandInput('ZOOM')}
				title="범위 줌 (Z) — 도면 전체를 화면에 맞춘다"
			>
				⛶
			</button>
			<button type="button" onClick={() => runCommandInput('ZOOMIN')} title="확대">
				＋
			</button>
			<span>{Math.round(zoom * 100)}%</span>
			<button type="button" onClick={() => runCommandInput('ZOOMOUT')} title="축소">
				－
			</button>
		</div>
	);
};