constructor(plugin, formatBrushString) {
        this.utils = plugin.utils
        this.formatBrushObj = this.parseStyleString(formatBrushString)
    }
This code contains workarounds and hacks to address specific behaviors of Typora.
Understanding the intricacies may be challenging. This documentation outlines the implementation logic for future modifications.

Core Idea: Simplify the problem by initially focusing on single-line selections.

1. Single-Line Selection Scenarios:
   Consider the example: `123<span style="color:#FF0000;">abc</span>defg`
   Four selection possibilities exist:
     a. No selection.
     b. Standard selection (e.g., "efg" - anything not covered by c and d).
     c. Selection within an existing styled span (e.g., "abc").
     d. Selection encompassing an entire styled span (e.g., `<span style="color:#FF0000;">abc</span>`).

2. Handling Simple Scenarios (a, b, and c):
     a. No selection: Insert an empty styled span (`<span style="XXX"></span>`) at the cursor.
     b. Standard selection: Wrap the selected text (e.g., "efg") with a styled span: `<span style="XXX">efg</span>`. Then, insert it back into the document.
     c. Selection within a span: Transform the selection into scenario d.  For example, "abc" becomes `<span style="color:#FF0000;">abc</span>`.

3. Handling Scenario d (Selecting an Existing Span):
     a. Deconstruct the example `123<span style="color:#FF0000;">abc</span>defg` into:
        - `beforeText`: "123" (Text before the span)
        - `innerText`: "abc" (Text inside the span)
        - `outerText`: `<span style="color:#FF0000;">abc</span>` (The entire span element)
        - `styleObject`: A JavaScript object representing the CSS style of the span (e.g., `{ color: '#FF0000' }`)
     b. Modify the `styleObject` as needed to apply the new styling.
     c. Reconstruct the `outerText` using the updated `innerText` and `styleObject`. Insert this new `outerText` back into the document.
     d. Use the `beforeText` and modified `styleObject` to determine the final position of the `innerText`.
        Move the bookmark (selection) to correctly re-select the `innerText`.
     e. The above steps are encapsulated in the `setInlineStyle` function.

4. Handling Multi-Line Selections:
   When the user selects text across multiple lines and potentially multiple tags, the process involves:
     a. Breaking the multi-line selection into individual lines.
     b. Applying the `setInlineStyle` function to each line.

   Implementation details for multi-line handling (`genRanges` function):
     a. Use `TreeWalker` along with the `range` object's `commonAncestorContainer`, `startContainer`, and `endContainer` to get an array of all selected nodes (`nodeList`).
     b. Filter out unnecessary text nodes within `<span md-inline="softbreak" class="md-softbreak"> </span>` tags (generated by shift+enter for soft line breaks).
     c. Split the `nodeList` into lines based on `node.classList.contains("md-softbreak")` (soft breaks) and `!!node.getAttribute("cid")` (hard breaks).
        Use `range.setStart(startContainer, startOffset)` and `range.setEnd(endContainer, endOffset)` to define the selection range for each line.
     d. The `startContainer` and `endContainer` will be TEXT_NODEs. Filter out any ELEMENT_NODEs to get an array of lines (`selectLines`).
     e. `selectLines` is a 2D array where each element is an array of TEXT_NODEs for a single line.
        The `startContainer` and `endContainer` correspond to the first and last TEXT_NODEs of each line, respectively.
     f. Special handling is required for the first and last lines, as they might not be fully selected.
     g. After splitting, you'll have the `startContainer`, `startOffset`, `endContainer`, and `endOffset` for each individual line.

5. Addressing Typora's DOM Manipulation Issues:
   Typora modifies the paragraph's `innerHTML` after inserting a span, invalidating the previously obtained TEXT_NODEs in the ranges. The solution is:
     a. The `textContent` of the paragraph remains unchanged after the span insertion. Record the position of the old TEXT_NODEs in the document *before* inserting the span.
     b. After Typora updates the DOM, use the recorded positions to find the *new* TEXT_NODEs.
     c. Replace the old TEXT_NODEs with the new TEXT_NODEs in the ranges.
     d. Now the (updated) TEXT_NODEs are valid. Proceed to call `setInlineStyle`.
     e. The above process is implemented in `setMultilineStyle`.  `recordTEXTPosition` handles the recording, and `renewRange` handles the replacement.

6. Overall Styling Process:
   The main function `setStyle` orchestrates the entire process, calling `genRanges`, `setMultilineStyle`, and the helper functions as needed.