드래그앤드롭 문제

1. 드래그해서 떨어뜨린 컴포넌트의 위치를 알아낸 후, 어떻게 해야 딱 그 위치에 해당 컴포넌트가 가지고 있는 수식을 넣을 수 있을까

[해결 방법]

• 드래그해서 떨어뜨린 컴포넌트의 위치 구하기

// 드래그 컴포넌트를 드롭 컴포넌트에 떨어뜨리면 호출되는 함수 : drop()
drop(item: { name: string; type: string; latex: string }, monitor) {
    // 드래그 컴포넌트의 y, x 좌표를 알 수 있다. 
		// clientOffset.x, clientOffset.y
		const clientOffset = monitor.getClientOffset();
},

• mathquill 공식 문서 정독

// 입력 좌표로 커서를 옮길 수 있다. 
mathQuiiFunc.clickAt(x, y);
// 현재 커서 위치에 string을 입력 할 수 있다. 
mathQuiiFunc.write(latexString);

• 해당 위치에 latex string을 넣어주는 handleClientOffset(x, y, latexString)함수 작성

const handleClientOffset = (x: number, y: number, latexString: string) => {
    mathQuiiFunc.clickAt(x, y);
    mathQuiiFunc.write(latexString);
  };

2. LateX 영역 Resizing 어떻게 구현할 수 있을까