Cant add new line in laravel ckeditor 5 integration

Question

Hello has anyone had an issue with adding new lines in CKEditor 5 (integrated into laravel/livewire)?

1. I have downloaded it from the official page and extracted to public folder.
2. This is initialization:

<script src="{{ asset('ckeditor5/ckeditor.js') }}"></script>

    <script>
        ClassicEditor.create(document.querySelector('#product_text'), {
            toolbar: {
                items: [ 'heading', '|', 'bold', 'italic', '|', 'undo', 'redo', '|', 'numberedList', 'bulletedList' ]
            }
        })
            .then(editor => {
                editor.model.document.on('change:data', () => {
                    @this.set('product_text', editor.getData());
                })
            })
            .catch(error => {
                console.error(error)
            })
    </script>

3. Here is the part of the code where it should be initialized:

<div class="form-group" wire:ignore>
                <label for="product_text">{{ __('Product text') }}</label>
                <textarea wire:model="product_text" name="product_text" id="product_text"
                          class="form-control col-10 master-content-product-text"
                          cols="30" rows="10"
                          placeholder="{{ __('Product text') }}">
                    {!! $masterContent->product_text ?? '' !!}
                </textarea>
            </div>

I am trying to go to the new line (when typing text) with enter, enter + shift, ...+ctrl ...

Does anyone have any suggestions?

Thanks

Answer 1

ANSWER

The issue was that I had one global initialization for the ckeditor4. The fix was to delete initialization for ckeditor4 and implement CKEditor 5 in all textareas where I needed it.