feat: script setup style

* Replace jsx with script setup syntax
* Simplify logic and make it more "composable"
    * Move Zoom functions to useZoom composable
* Update eslint config & tsconfig

src/utils/index.ts

@@ -5,16 +5,16 @@ export const isInputDOMNode = (e: KeyboardEvent | MouseEvent): boolean => {
   return ['INPUT', 'SELECT', 'TEXTAREA', 'BUTTON'].includes(target.nodeName) || target.hasAttribute('contentEditable')
 }
 
-export const getDimensions = (node: HTMLDivElement): Dimensions => ({
+export const getDimensions = (node: HTMLElement): Dimensions => ({
   width: node.offsetWidth,
-  height: node.offsetHeight
+  height: node.offsetHeight,
 })
 
 export const clamp = (val: number, min = 0, max = 1): number => Math.min(Math.max(val, min), max)
 
 export const clampPosition = (position: XYPosition, extent: NodeExtent): XYPosition => ({
   x: clamp(position.x, extent[0][0], extent[1][0]),
-  y: clamp(position.y, extent[0][1], extent[1][1])
+  y: clamp(position.y, extent[0][1], extent[1][1]),
 })
 
 export const getHostForElement = (element: HTMLElement): Document | ShadowRoot =>