CKEditor link dialog pop not accepting input

Viewed 8

Tech Stack: Laravel / Vuetify

I have a dialog component that is an overlay. Overlay compoent

When I click the link icon in the ckeditor, the first input is selected and not the link pop up input. I have removed all inputs from the overlay expect the ckeditor. When I click the link icon again the text style dropdown is selected.

I tested the ckeditor on a parent component that was not an overlay and I was able to access the link pop input with no issues. I thought it was a z-index issue, but no matter what I put the index to for the pop up. I still get the same results of the icon select any input but its own input.

Vue code

<v-row>
  <v-col cols="12" class="font-weight-bold">
     URL Description 1:
  </v-col>
  <v-col cols="12">
 <ckeditor :editor="editor" v-model="pages.component.options.url_1_description" 
 :config="editorConfig" style="height:250px"></ckeditor>
  </v-col>
</v-row>

Script in vue code:

import ClassicEditor from "@ckeditor/ckeditor5-build-classic";

export default {
   components: { ClassicEditor },
   data() {
      return {
         editor: ClassicEditor,
         editorConfig: {},
      };
   },
}:
0 Answers
Related