Implement initial BesTAService class for grammar checking in textarea

This commit introduces the BesTAService class, which is designed to register a grammar checking service for textarea elements. The core logic has been written, although the class is not yet fully functional.

service.js

@@ -669,6 +669,61 @@ class BesCKService extends BesService {
   }
 }
 
+class BesTAService {
+  constructor(textAreaEl) {
+    this.textAreaEl = textAreaEl
+    this.textAreaEl.spellcheck = false
+    this.cloneDiv = this.createCloneDiv(textAreaEl)
+    this.service = BesService.register(this.cloneDiv)
+    this.textAreaEl.addEventListener('input', () => this.handleInput())
+  }
+
+  createCloneDiv(textAreaEl) {
+    const cloneDiv = document.createElement('div')
+    const textAreaRect = textAreaEl.getBoundingClientRect()
+    cloneDiv.style.top = `${textAreaRect.top}px`
+    cloneDiv.style.left = `${textAreaRect.left}px`
+    const textAreaStyles = window.getComputedStyle(textAreaEl)
+    cloneDiv.style.fontSize = textAreaStyles.fontSize
+    cloneDiv.style.fontFamily = textAreaStyles.fontFamily
+    cloneDiv.style.lineHeight = textAreaStyles.lineHeight
+    cloneDiv.style.width = textAreaStyles.width
+    cloneDiv.style.height = textAreaStyles.height
+    cloneDiv.style.padding = textAreaStyles.padding
+    cloneDiv.style.margin = textAreaStyles.margin
+    cloneDiv.style.position = 'absolute'
+    textAreaEl.style.position = 'relative'
+    textAreaEl.style.zIndex = 2
+
+    textAreaEl.parentNode.insertBefore(cloneDiv, textAreaEl)
+    return cloneDiv
+  }
+
+  handleInput() {
+    const customEvent = new InputEvent('beforeinput')
+
+    const lines = this.textAreaEl.value.split('\n')
+    this.cloneDiv.innerHTML = ''
+    lines.forEach(line => {
+      const divEl = document.createElement('div')
+      divEl.textContent = line
+      this.cloneDiv.appendChild(divEl)
+    })
+    this.cloneDiv.dispatchEvent(customEvent)
+  }
+
+  /**
+   * Registers grammar checking service
+   *
+   * @param {Element} textAreaEl DOM element to register grammar checking service for
+   * @returns {BesTAService} Grammar checking service instance
+   */
+  static register(textAreaEl) {
+    let service = new BesTAService(textAreaEl)
+    return service
+  }
+}
+
 ///
 /// Grammar mistake popup dialog
 ///
@@ -814,7 +869,6 @@ class BesPopupEl extends HTMLElement {
   }
 
   dragMouseDown(e) {
-    e = e
     e.preventDefault()
     this.initialMouseX = e.clientX
     this.initialMouseY = e.clientY
@@ -824,7 +878,6 @@ class BesPopupEl extends HTMLElement {
 
   // Function to handle the mousemove event
   elementDrag(e) {
-    e = e
     e.preventDefault()
 
     let diffX = this.initialMouseX - e.clientX
@@ -880,6 +933,9 @@ window.onload = () => {
   document
     .querySelectorAll('.bes-service')
     .forEach(hostElement => BesService.register(hostElement))
+  document.querySelectorAll('.bes-service-textarea').forEach(hostElement => {
+    BesTAService.register(hostElement)
+  })
 }
 
 window.onresize = () => {