fix: prefix the collaboration cursor classname (#1498)

Author: nperez0111

packages/core/src/editor/editor.css

@@ -86,19 +86,19 @@ Tippy popups that are appended to document.body directly
   opacity: 0.001;
 }
 
-.bn-editor .collaboration-cursor__base {
+.bn-editor .bn-collaboration-cursor__base {
   position: relative;
 }
 
-.bn-editor .collaboration-cursor__base .collaboration-cursor__caret {
+.bn-editor .bn-collaboration-cursor__base .bn-collaboration-cursor__caret {
   position: absolute;
   width: 2px;
   top: 1px;
   bottom: -2px;
   left: -1px;
 }
 
-.bn-editor .collaboration-cursor__base .collaboration-cursor__label {
+.bn-editor .bn-collaboration-cursor__base .bn-collaboration-cursor__label {
   pointer-events: none;
   border-radius: 0 1.5px 1.5px 0;
   font-size: 12px;
@@ -120,8 +120,8 @@ Tippy popups that are appended to document.body directly
 }
 
 .bn-editor
-  .collaboration-cursor__base[data-active]
-  .collaboration-cursor__label {
+  .bn-collaboration-cursor__base[data-active]
+  .bn-collaboration-cursor__label {
   color: #0d0d0d;
   max-height: 1.1rem;
   max-width: 20rem;

packages/core/src/extensions/Collaboration/createCollaborationExtensions.ts

@@ -65,16 +65,16 @@ export const createCollaborationExtensions = (collaboration: {
     const renderCursor = (user: { name: string; color: string }) => {
       const cursorElement = document.createElement("span");
 
-      cursorElement.classList.add("collaboration-cursor__base");
+      cursorElement.classList.add("bn-collaboration-cursor__base");
 
       const caretElement = document.createElement("span");
       caretElement.setAttribute("contentedEditable", "false");
-      caretElement.classList.add("collaboration-cursor__caret");
+      caretElement.classList.add("bn-collaboration-cursor__caret");
       caretElement.setAttribute("style", `background-color: ${user.color}`);
 
       const labelElement = document.createElement("span");
 
-      labelElement.classList.add("collaboration-cursor__label");
+      labelElement.classList.add("bn-collaboration-cursor__label");
       labelElement.setAttribute("style", `background-color: ${user.color}`);
       labelElement.insertBefore(document.createTextNode(user.name), null);