diff --git a/Readme.md b/Readme.md
index 7bbf1e7..65ba956 100644
--- a/Readme.md
+++ b/Readme.md
@@ -1,6 +1,6 @@
-# Spletni urejevalnik s podporo za preverjanje pravopisa
+# Servis za preverjanje pravopisa v dokumentih HTML
 
-Spletni urejevalnik je nadgradnja urejevalnika HTML `<div contenteditable="true">`, ki v besedilu urejevalnika preverja in podčrta pravopisne napake. Namenjen je vgradnji v različne spletne strani in storitve, kjer uporabniki vnašajo besedila v naravnem jeziku.
+Servis je nadgradnja urejevalnikov HTML `<div contenteditable="true">`, ki v besedilu urejevalnika preverja in podčrta pravopisne napake. Namenjen je vgradnji v različne spletne strani in storitve, kjer uporabniki vnašajo besedila v naravnem jeziku.
 
 ## Sistemske zahteve
 
@@ -9,9 +9,9 @@ Spletni urejevalnik je nadgradnja urejevalnika HTML `<div contenteditable="true"
 
 ## Navodila za vgradnjo
 
-V svoji kodi HTML vključimo Spletni urejevalnik tako, da:
+V svoji kodi HTML vključimo servis za preverjanje pravopisa tako, da:
 
-### 1. Vključimo JavaScript in CSS Spletnega urejevalnika
+### 1. Vključimo JavaScript in CSS servisa
 
 Primer:
 
@@ -19,21 +19,22 @@ Primer:
 <head>
     ...
     <link rel="stylesheet" href="styles.css" />
-    <script src="online-editor.js"></script>
-    <script src="popup.js"></script>
+    <script src="service.js"></script>
 </head>
 ```
 
-### 2. V kodo HTML vstavimo urejevalnik
+### 2. V kodo HTML vstavimo servis
 
 Primer:
 
 ```html
-<!-- Vsi elementi z razredom CSS `bes-online-editor` se registrirajo samodejno. -->
-<div class="bes-online-editor" contenteditable="true">Začetno besedilo</div>
+<!-- Vsi elementi z razredom CSS `bes-service` se registrirajo samodejno v document.onload. -->
+<div class="bes-service" contenteditable="true">Začetno besedilo</div>
+<!-- V dokument mora biti mesto, kjer servis uredi prikaz okna na klik napake. -->
+<bes-popup-el></bes-popup-el>
 ```
 
-Kadar vstavljamo urejevalnik v HTML-jev DOM dinamično (npr. z uporabo JavaScript), registriramo urejevalnik tako, da kličemo metodo `BesEditor.register(el)`, kjer `el` predstavlja naš element DOM našega urejevalnika. V tem primeru razred CSS `bes-online-editor` ni potreben.
+Kadar vstavljamo servis v HTML-jev DOM dinamično (npr. z uporabo JavaScript), registriramo servis tako, da kličemo metodo `BesService.register(el)`, kjer `el` predstavlja element DOM našega urejevalnika. V tem primeru razred CSS `bes-service` ni potreben.
 
 Primer:
 
@@ -44,12 +45,12 @@ const el = document.createElement('div')
 el.contentEditable = "true";
 
 // Element urejevalnika vstavimo v DOM. Element urejevalnika mora biti
-// vstavljen v dokument pred klicem `BesEditor.register(el)`, ker
+// vstavljen v dokument pred klicem `BesService.register(el)`, ker
 // registracija potrebuje njegovo pozicijo v drevesu DOM.
 parent.appendChild(el)
 
-// Registriramo urejevalnik.
-BesEditor.register(el)
+// Registriramo servis za naš urejevalnik.
+BesService.register(el)
 ```
 
 ## Navodila za razvijalce
diff --git a/ckeditor.html b/ckeditor.html
index 5b57252..35b6fda 100644
--- a/ckeditor.html
+++ b/ckeditor.html
@@ -2,10 +2,10 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <title>CKEditor 5 – Classic editor</title>
+    <title>CKEditor 5 Example</title>
     <link rel="stylesheet" href="styles.css" />
     <script src="https://cdn.ckeditor.com/ckeditor5/41.1.0/classic/ckeditor.js"></script>
-    <script src="online-editor.js"></script>
+    <script src="service.js"></script>
   </head>
   <body>
     <div id="editor">
@@ -15,7 +15,7 @@
     <script>
       ClassicEditor.create(document.querySelector('#editor'))
         .then(newEditor => {
-          BesEditor.register(newEditor.ui.view.editable.element, newEditor)
+          BesService.register(newEditor.ui.view.editable.element, newEditor)
         })
         .catch(error => {
           console.error(error)
diff --git a/index.html b/index.html
index 6392ccb..987d60a 100644
--- a/index.html
+++ b/index.html
@@ -3,33 +3,33 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Editor</title>
+    <title>BesService Example</title>
     <link rel="stylesheet" href="styles.css" />
-    <script src="online-editor.js"></script>
+    <script src="service.js"></script>
   </head>
   <body>
-    <!--<div class="bes-online-editor" contenteditable="true">Tukaj vpišite besedilo ki ga želite popraviti.</div>
-    <br>-->
-    <div class="bes-online-editor" contenteditable="true"></div>
-    <br />
-    <!--<div class="bes-online-editor" contenteditable="true"><div>Popravite kar želite.</div></div>
+    <div class="bes-service" contenteditable="true">Tukaj vpišite besedilo ki ga želite popraviti.</div>
     <br>
-    <div class="bes-online-editor" contenteditable="true"><div>Popravite <a href=".">kar želite</a>.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div>
-    <br>-->
-    <!-- <div class="bes-online-editor" contenteditable="true">To je preiskus.</div> -->
-    <!-- <br> -->
-    <!-- <div class="bes-online-editor" contenteditable="true"><div class="contextual"><p>Madžarski premier Orban je tako očitno vendarle pristal na nadaljnjo makrofinančno pomoč Ukrajini v okviru revizije dolgoročnega proračuna unije 2021-2027. Ta vključuje 50 milijard evrov za Ukrajino za prihodnja štiri leta, od tega 33 milijard evrov posojil in 17 milijard evrov nepovratnih sredstev.</p></div></div>
-    <br>-->
-    <!-- <div class="bes-online-editor" contenteditable="true"><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div> -->
-    <!-- <br>
-    <div class="bes-online-editor" contenteditable="true"><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite. Na mizo nisem položil knjigo.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div> -->
-    <!-- <br />
-    <textarea class="bes-online-editor"></textarea> -->
+    <div class="bes-service" contenteditable="true"></div>
+    <!--<br />
+    <div class="bes-service" contenteditable="true"><div>Popravite kar želite.</div></div>
+    <br>
+    <div class="bes-service" contenteditable="true"><div>Popravite <a href=".">kar želite</a>.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div>-->
+    <br>
+    <div class="bes-service" contenteditable="true">To je preiskus.</div>
+    <!--<br>
+    <div class="bes-service" contenteditable="true"><div class="contextual"><p>Madžarski premier Orban je tako očitno vendarle pristal na nadaljnjo makrofinančno pomoč Ukrajini v okviru revizije dolgoročnega proračuna unije 2021-2027. Ta vključuje 50 milijard evrov za Ukrajino za prihodnja štiri leta, od tega 33 milijard evrov posojil in 17 milijard evrov nepovratnih sredstev.</p></div></div>-->
+    <!--<br>
+    <div class="bes-service" contenteditable="true"><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div>-->
+    <br>
+    <div class="bes-service" contenteditable="true"><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite. Na mizo nisem položil knjigo.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div>
+    <!--<br />
+    <textarea class="bes-service"></textarea>-->
     <bes-popup-el></bes-popup-el>
   </body>
 </html>
 <style>
-  .bes-online-editor {
+  .bes-service {
     width: 80%;
     height: 300px;
     margin: 0 auto;
diff --git a/online-editor.js b/service.js
similarity index 80%
rename from online-editor.js
rename to service.js
index 25853c7..556f150 100644
--- a/online-editor.js
+++ b/service.js
@@ -1,54 +1,54 @@
 const besUrl = 'http://localhost:225/api/v2/check'
 
-let besEditors = [] // Collection of all grammar checking services in the document
+let besServices = [] // Collection of all grammar checking services in the document
 
 // TODO: Add support for <textarea>
 
-class BesEditor {
-  constructor(edit, CKEditorInstance) {
-    this.editorElement = edit
+class BesService {
+  constructor(hostElement, ckEditorInstance) {
+    this.hostElement = hostElement
     this.timer = null
     this.children = []
-    const { correctionPanel, scrollPanel } = this.createCorrectionPanel(edit)
+    const { correctionPanel, scrollPanel } = this.createCorrectionPanel(hostElement)
     this.correctionPanel = correctionPanel
     this.scrollPanel = scrollPanel
     this.offsetTop = null
-    this.CKEditorInstance = CKEditorInstance
-    this.originalSpellcheck = edit.spellcheck
-    edit.spellcheck = false
+    this.ckEditorInstance = ckEditorInstance
+    this.originalSpellcheck = hostElement.spellcheck
+    hostElement.spellcheck = false
     this.abortController = new AbortController()
-    this.proof(edit)
-    edit.addEventListener('beforeinput', BesEditor.handleBeforeInput, false)
-    edit.addEventListener('click', BesEditor.handleClick)
-    edit.addEventListener('scroll', BesEditor.handleScroll)
-    besEditors.push(this)
+    this.proof(hostElement)
+    hostElement.addEventListener('beforeinput', BesService.handleBeforeInput, false)
+    hostElement.addEventListener('click', BesService.handleClick)
+    hostElement.addEventListener('scroll', BesService.handleScroll)
+    besServices.push(this)
   }
 
   /**
    * Registers grammar checking service
    *
-   * @param {Element} edit DOM element to register grammar checking service for
-   * @param {CKEditorInstance} CKEditorInstance Enable CKEditor tweaks
-   * @returns {BesEditor} Grammar checking service instance
+   * @param {Element} hostElement DOM element to register grammar checking service for
+   * @param {CKEditorInstance} ckEditorInstance Enable CKEditor tweaks
+   * @returns {BesService} Grammar checking service instance
    */
-  static register(edit, CKEditorInstance) {
-    return new BesEditor(edit, CKEditorInstance)
+  static register(hostElement, ckEditorInstance) {
+    return new BesService(hostElement, ckEditorInstance)
   }
 
   /**
    * Unregisters grammar checking service
    */
   unregister() {
-    this.editorElement.removeEventListener('scroll', BesEditor.handleScroll)
-    this.editorElement.removeEventListener('click', BesEditor.handleClick)
-    this.editorElement.removeEventListener(
+    this.hostElement.removeEventListener('scroll', BesService.handleScroll)
+    this.hostElement.removeEventListener('click', BesService.handleClick)
+    this.hostElement.removeEventListener(
       'beforeinput',
-      BesEditor.handleBeforeInput,
+      BesService.handleBeforeInput,
       false
     )
     if (this.timer) clearTimeout(this.timer)
-    besEditors = besEditors.filter(item => item !== this)
-    this.editorElement.spellcheck = this.originalSpellcheck
+    besServices = besServices.filter(item => item !== this)
+    this.hostElement.spellcheck = this.originalSpellcheck
     this.correctionPanel.remove()
     this.scrollPanel.remove()
   }
@@ -65,7 +65,7 @@ class BesEditor {
         return [{ text: node.textContent, node: node, markup: false }]
 
       case Node.ELEMENT_NODE:
-        if (BesEditor.isBlockElement(node)) {
+        if (BesService.isBlockElement(node)) {
           // Block elements are grammar-proofed independently.
           if (this.isProofed(node)) {
             return [
@@ -183,18 +183,18 @@ class BesEditor {
     }
   }
 
-  createCorrectionPanel(edit) {
+  createCorrectionPanel(hostElement) {
     const panelParent = document.createElement('div')
     panelParent.classList.add('bes-correction-panel-parent')
     const correctionPanel = document.createElement('div')
     const scrollPanel = document.createElement('div')
-    this.setCorrectionPanelSize(edit, correctionPanel, scrollPanel)
+    this.setCorrectionPanelSize(hostElement, correctionPanel, scrollPanel)
     correctionPanel.classList.add('bes-correction-panel')
     scrollPanel.classList.add('bes-correction-panel-scroll')
 
     correctionPanel.appendChild(scrollPanel)
     panelParent.appendChild(correctionPanel)
-    edit.parentElement.insertBefore(panelParent, edit)
+    hostElement.parentElement.insertBefore(panelParent, hostElement)
 
     return { correctionPanel, scrollPanel }
   }
@@ -207,28 +207,28 @@ class BesEditor {
    * @param {InputEvent} event The event notifying the user of editable content changes
    */
   static handleBeforeInput(event) {
-    const edit = event.target
-    let editor = besEditors.find(e => e.editorElement === edit)
-    if (!editor) return
-    if (editor.timer) clearTimeout(editor.timer)
-    editor.abortController.abort()
+    const hostElement = event.target
+    let service = besServices.find(e => e.hostElement === hostElement)
+    if (!service) return
+    if (service.timer) clearTimeout(service.timer)
+    service.abortController.abort()
     let blockElements = new Set()
     event.getTargetRanges().forEach(range => {
-      BesEditor.getNodesInRange(range).forEach(el =>
-        blockElements.add(editor.getBlockParent(el))
+      BesService.getNodesInRange(range).forEach(el =>
+        blockElements.add(service.getBlockParent(el))
       )
     })
     blockElements.forEach(block => {
-      editor.clearMistakeMarkup(block)
-      editor.removeChild(block)
+      service.clearMistakeMarkup(block)
+      service.removeChild(block)
     })
     // Not a nice way to do it, but it works for now the repositionMistakes function is called before the DOM updates are finished.
     setTimeout(() => {
-      editor.repositionMistakes()
+      service.repositionMistakes()
     }, 0)
-    editor.timer = setTimeout(function () {
-      editor.abortController = new AbortController()
-      editor.proof(edit)
+    service.timer = setTimeout(function () {
+      service.abortController = new AbortController()
+      service.proof(hostElement)
     }, 1000)
   }
 
@@ -257,7 +257,7 @@ class BesEditor {
     })
 
     // This is a solution for displaying mistakes in CKEditor. It is not the best solution, but it works for now.
-    if (this.CKEditorInstance) window.dispatchEvent(new Event('resize'))
+    if (this.ckEditorInstance) window.dispatchEvent(new Event('resize'))
   }
 
   /**
@@ -354,8 +354,8 @@ class BesEditor {
    * @returns {Element} Innermost block element containing given node
    */
   getBlockParent(el) {
-    for (; el && el !== this.editorElement; el = el.parentNode) {
-      if (el.nodeType === Node.ELEMENT_NODE && BesEditor.isBlockElement(el))
+    for (; el && el !== this.hostElement; el = el.parentNode) {
+      if (el.nodeType === Node.ELEMENT_NODE && BesService.isBlockElement(el))
         return el
     }
     return el
@@ -400,8 +400,8 @@ class BesEditor {
     var start = range.startContainer
     var end = range.endContainer
 
-    let startAncestors = BesEditor.getParents(start)
-    let endAncestors = BesEditor.getParents(end)
+    let startAncestors = BesService.getParents(start)
+    let endAncestors = BesService.getParents(end)
     let commonAncestor = null
     for (
       let i = 0;
@@ -424,7 +424,7 @@ class BesEditor {
     nodes.reverse()
 
     // walk children and siblings from start until end is found
-    for (node = start; node; node = BesEditor.getNextNode(node)) {
+    for (node = start; node; node = BesService.getNextNode(node)) {
       nodes.push(node)
       if (node == end) break
     }
@@ -440,41 +440,41 @@ class BesEditor {
    * @param {PointerEvent} event The event produced by a pointer such as the geometry of the contact point, the device type that generated the event, the amount of pressure that was applied on the contact surface, etc.
    */
   static handleClick(event) {
-    const edit = BesEditor.findParent(event.target)
-    let editor = besEditors.find(e => e.editorElement === edit)
-    if (!editor) return
-    const target = editor.getBlockParent(event.target)
-    editor.renderPopup(target, event.clientX, event.clientY)
+    const hostElement = BesService.findParent(event.target)
+    let service = besServices.find(e => e.hostElement === hostElement)
+    if (!service) return
+    const target = service.getBlockParent(event.target)
+    service.renderPopup(target, event.clientX, event.clientY)
   }
 
   /**
    * scroll event handler
    *
-   * Syncs grammar mistake positions with editor scroll offset.
+   * Syncs grammar mistake positions with host element scroll offset.
    *
    * @param {Event} event The event which takes place.
    */
   static handleScroll(event) {
-    const edit = event.target
-    let editor = besEditors.find(e => e.editorElement === edit)
-    if (!editor) return
-    editor.scrollPanel.style.top = -edit.scrollTop + 'px'
-    editor.offsetTop = edit.scrollTop
+    const hostElement = event.target
+    let service = besServices.find(e => e.hostElement === hostElement)
+    if (!service) return
+    service.scrollPanel.style.top = -hostElement.scrollTop + 'px'
+    service.offsetTop = hostElement.scrollTop
     setTimeout(() => {
-      editor.repositionMistakes()
+      service.repositionMistakes()
     }, 100)
     // TODO: Move popup (if open) too.
   }
 
   /**
-   * Finds the editor with grammar checking service a DOM node is child of.
+   * Finds the host element with grammar checking service a DOM node is child of.
    *
    * @param {Node} el DOM node
-   * @returns {Element} Editor DOM element; null if DOM node is not a descendant of an editor.
+   * @returns {Element} Host DOM element; null if DOM node is not a descendant of any registered host element.
    */
   static findParent(el) {
     for (; el; el = el.parentNode) {
-      if (besEditors.find(editor => editor.editorElement === el)) {
+      if (besServices.find(service => service.hostElement === el)) {
         return el
       }
     }
@@ -495,14 +495,15 @@ class BesEditor {
       for (let m of matches) {
         if (m.rects) {
           for (let r of m.rects) {
-            if (BesEditor.isPointInRect(clientX, clientY, r)) {
+            if (BesService.isPointInRect(clientX, clientY, r)) {
               popup.changeText(m.match.message)
               m.match.replacements.forEach(replacement => {
                 popup.appendReplacements(
                   el,
                   m,
                   replacement.value,
-                  this
+                  this,
+                  this.hostElement.contentEditable !== 'false'
                 )
               })
               popup.show(clientX, clientY)
@@ -521,16 +522,16 @@ class BesEditor {
     if (this.timer) clearTimeout(this.timer)
     this.abortController.abort()
     // const tags = this.getTagsAndText(el)
-    if (!this.CKEditorInstance) {
+    if (!this.ckEditorInstance) {
       match.range.deleteContents()
       match.range.insertNode(document.createTextNode(replacement))
     } else {
-      const { CKEditorInstance } = this
-      CKEditorInstance.model.change(writer => {
+      const { ckEditorInstance } = this
+      ckEditorInstance.model.change(writer => {
         const viewElement =
-          CKEditorInstance.editing.view.domConverter.mapDomToView(el)
+          ckEditorInstance.editing.view.domConverter.mapDomToView(el)
         const modelElement =
-          CKEditorInstance.editing.mapper.toModelElement(viewElement)
+          ckEditorInstance.editing.mapper.toModelElement(viewElement)
         if (modelElement) {
           const elementRange = writer.createRangeIn(modelElement)
           // TODO: This logic should work once the HTML tags are removed from match.match.offset and match.match.length if is possible.
@@ -558,22 +559,8 @@ class BesEditor {
     this.proof(el)
   }
 
-  // static getTagsAndText(node) {
-  //   if (node.nodeType === Node.TEXT_NODE) {
-  //     return node.textContent
-  //   } else if (node.nodeType === Node.ELEMENT_NODE) {
-  //     let tag = node.tagName.toLowerCase()
-  //     let content = Array.from(node.childNodes)
-  //       .map(BesEditor.getTagsAndText)
-  //       .join('')
-  //     return `<${tag}>${content}</${tag}>`
-  //   } else {
-  //     return ''
-  //   }
-  // }
-
-  setCorrectionPanelSize(editor, correctionPanel, scrollPanel) {
-    const styles = window.getComputedStyle(editor)
+  setCorrectionPanelSize(hostElement, correctionPanel, scrollPanel) {
+    const styles = window.getComputedStyle(hostElement)
     const totalWidth =
       parseFloat(styles.width) +
       parseFloat(styles.marginLeft) +
@@ -588,7 +575,7 @@ class BesEditor {
       parseFloat(styles.paddingBottom)
     correctionPanel.style.width = totalWidth + 'px'
     correctionPanel.style.height = totalHeight + 'px'
-    scrollPanel.style.height = editor.scrollHeight + 'px'
+    scrollPanel.style.height = hostElement.scrollHeight + 'px'
   }
 
   static isPointInRect(x, y, rect) {
@@ -602,23 +589,22 @@ class BesEditor {
 }
 
 window.onload = () => {
-  // Search and prepare all our editors found in the document.
   document
-    .querySelectorAll('.bes-online-editor')
-    .forEach(edit => BesEditor.register(edit))
+    .querySelectorAll('.bes-service')
+    .forEach(hostElement => BesService.register(hostElement))
 }
 
 window.onresize = () => {
-  besEditors.forEach(editor => {
-    editor.setCorrectionPanelSize(
-      editor.editorElement,
-      editor.correctionPanel,
-      editor.scrollPanel
+  besServices.forEach(service => {
+    service.setCorrectionPanelSize(
+      service.hostElement,
+      service.correctionPanel,
+      service.scrollPanel
     )
-    editor.children.forEach(child => {
-      editor.clearMistakeMarkup(child.element)
+    service.children.forEach(child => {
+      service.clearMistakeMarkup(child.element)
       child.matches.forEach(match => {
-        const { clientRects, highlights } = editor.addMistakeMarkup(match.range)
+        const { clientRects, highlights } = service.addMistakeMarkup(match.range)
         match.rects = clientRects
         match.highlights = highlights
       })
@@ -738,14 +724,16 @@ class BesPopupEl extends HTMLElement {
     this.shadowRoot.querySelector('.popup-text').textContent = text
   }
 
-  appendReplacements(el, match, replacement, editor) {
+  appendReplacements(el, match, replacement, service, allowReplacements) {
     const replacementDiv = this.shadowRoot.querySelector('.bes-replacement-div')
     const replacementBtn = document.createElement('button')
     replacementBtn.classList.add('bes-replacement-btn')
     replacementBtn.textContent = replacement
     replacementBtn.classList.add('bes-replacement')
     replacementBtn.addEventListener('click', () => {
-      editor.replaceText(el, match, replacement)
+      if (allowReplacements)
+        service.replaceText(el, match, replacement)
+      // TODO: Close popup
     })
     replacementDiv.appendChild(replacementBtn)
   }
