Add history tab to Devtools

[chacha912]

What this PR does / why we need it?

https://github.com/yorkie-team/yorkie-js-sdk/assets/81357083/cfac3fd2-7e9e-4091-8b53-dcbeeec6543c

Enhancements in Devtools Introduce new features in this PR, enhancing the functionality of Devtools:

• Addition of History Tab
  • Introducing the History tab, where you can now view the history of document changes (HistoryChangePack).
    • local-change: Highlighted in yellow , remote-change: Highlighted in blue.
    • presence-change: Identified with cursor icon , document-change: Identified with document icon.
  • Time-travel within the History tab.
    • Slide the HistoryChangePack slider to explore the document at specific time points.
    • Click on a HistoryChangePack to access detailed event and operation information associated with the change.
    • Convenient navigation is also possible using the arrows on the right side of the tab.
• Enhanced Tree Graph Display
  • Mouseover tree nodes to access attributes, index, path, and pos information.
• UI Improvements
  • Resize history, document, and presence tabs by simply dragging.

Any background context you want to provide?

as-is	to-be

Devtools are available by default in the development build environment. If you want to change the availability of Devtools, you can do so as follows:

const doc = new yorkie.Document('docKey', {
  enableDevtools: true, // Modify the condition according to your situation
});

What are the relevant tickets?

Fixes #

Checklist

• [x] Added relevant tests or not required
• [x] Didn't break anything