When i enter any Letter/Sentence in CKEditor, then make it as any List and here after selecting the List the Letter/Sentence Heading is getting change from Paragraph to Choose Heading.
List are not accepting a Heading

When i enter any Letter/Sentence in CKEditor, then make it as any List, that List should accepts as a Heading
enter image description here
Code :

requiredToolbarItems: any = [
‘bold’, ‘italic’, ‘strikethrough’, ‘underline’, ,
‘bulletedList’, ‘numberedList’, ‘todoList’, ‘|’,
‘undo’, ‘redo’,
‘fontSize’, ‘fontFamily’, ‘fontColor’, ‘fontBackgroundColor’, ‘|’,
‘alignment’, ‘|’,
// ‘fullscreen’,’fontBackgroundColor’,
]
optionaltoolbarItems: any = [‘heading’, ‘|’, ‘outdent’, ‘indent’, ‘|’, ‘code’, ‘subscript’, ‘superscript’, ‘removeFormat’, ‘|’, ‘link’,
// ‘blockQuote’
‘insertTable’, ‘|’, ‘sourceEditing’, ‘MathType’, ‘ChemType’]

createCkeditor() {
CKEDITOR.ClassicEditor.create(this.myEditor.nativeElement, {

  toolbar: {
    items: this.requiredToolbarItems.concat(this.isShowLimitedOptions == 'true' ? [] : this.optionaltoolbarItems),
    shouldNotGroupWhenFull: true
  },
  list: {
    properties: {
      styles: true,
      startIndex: true,
      reversed: true
    }
  },
  // https://ckeditor.com/docs/ckeditor5/latest/features/headings.html#configuration
  heading: {
    options: [
      { model: 'paragraph', title: 'Paragraph', class: 'ck-heading_paragraph' },
      { model: 'heading1', view: 'h1', title: 'Heading 1', class: 'ck-heading_heading1' },
      { model: 'heading2', view: 'h2', title: 'Heading 2', class: 'ck-heading_heading2' },
      { model: 'heading3', view: 'h3', title: 'Heading 3', class: 'ck-heading_heading3' },
      { model: 'heading4', view: 'h4', title: 'Heading 4', class: 'ck-heading_heading4' },
      { model: 'heading5', view: 'h5', title: 'Heading 5', class: 'ck-heading_heading5' },
      { model: 'heading6', view: 'h6', title: 'Heading 6', class: 'ck-heading_heading6' }
    ]
  },
  placeholder: 'Type here',
  fontFamily: {
    options: [
      'default',
      'Arial, Helvetica, sans-serif',
      'Courier New, Courier, monospace',
      'Georgia, serif',
      'Lucida Sans Unicode, Lucida Grande, sans-serif',
      'Tahoma, Geneva, sans-serif',
      'Times New Roman, Times, serif',
      'Trebuchet MS, Helvetica, sans-serif',
      'Verdana, Geneva, sans-serif'
    ],
    supportAllValues: true
  },
  fontSize: {
    options: [10, 12, 14, 'default', 18, 20, 22],
    supportAllValues: true
  },
  htmlSupport: {
    allow: [
      {
        name: /.*/,
        attributes: true,
        classes: true,
        styles: true
      }
    ]
  },
  htmlEmbed: {
    showPreviews: true
  },

  link: {
    decorators: {
      addTargetToExternalLinks: true,
      defaultProtocol: 'https://',
      toggleDownloadable: {
        mode: 'manual',
        label: 'Downloadable',
        attributes: {
          download: 'file'
        }
      }
    }
  },
  mention: {
    feeds: [
      {
        marker: '@',
        feed: [
          '@apple', '@bears', '@brownie', '@cake', '@cake', '@candy', '@canes', '@chocolate', '@cookie', '@cotton', '@cream',
          '@cupcake', '@danish', '@donut', '@dragée', '@fruitcake', '@gingerbread', '@gummi', '@ice', '@jelly-o',
          '@liquorice', '@macaroon', '@marzipan', '@oat', '@pie', '@plum', '@pudding', '@sesame', '@snaps', '@soufflé',
          '@sugar', '@sweet', '@topping', '@wafer'
        ],
        minimumCharacters: 1
      }
    ]
  },
  mathTypeParameters: {
    service: 'https://www.wiris.net/demo/editor',
    editorParameters: { language: 'en' },
    textPartLanguage: ['en']
  },
  removePlugins: [
    'CKBox',
    'CKFinder',
    'EasyImage',
    'RealTimeCollaborativeComments',
    'RealTimeCollaborativeTrackChanges',
    'RealTimeCollaborativeRevisionHistory',
    'PresenceList',
    'Comments',
    'TrackChanges',
    'TrackChangesData',
    'RevisionHistory',
    'Pagination',
    'WProofreader',
    'SlashCommand',
    'Template',
    'DocumentOutline',
    'FormatPainter',
    'TableOfContents',
    'ImageToolbar',
    'ImageStyle',
    'ImageResize',
    'Autoformat'  
  ],

  // commands: {
  //   CustomButton: {
  //     // Label for the button
  //     label: 'Media Handler',

  //     // Icon for the button
  //     icon: './assets/images/icon/FocalPoint-Icon-1.png',

  //     // Function to execute when the button is clicked
  //     command: function (editor) {
  //       // Your custom logic goes here
  //       alert('Custom button clicked!');
  //     },
  //   }
  // }
}).then(editor => {
  this.editor = editor;
  this.updateEditor.emit(editor);
  // this.updateEditor.subscribe(() => {
  //   console.log("test")
  // });
  if (this.editorValue) {
    editor.setData(this.editorValue);
    this.editor = this.editorValue;
  }
  if (this.fromMini) {
    setTimeout(() => {
      const mathTypeButton = editor.ui.view.toolbar.element.querySelector('button[data-cke-tooltip-text="Insert a math equation - MathType"]');
      const chemTypeButton = editor.ui.view.toolbar.element.querySelector('button[data-cke-tooltip-text="Insert a chemistry formula - ChemType"]');
      if (mathTypeButton && chemTypeButton) {
        mathTypeButton.style.display = 'none';
        chemTypeButton.style.display = 'none';
      }
    }, 0)
  }
  // editor.plugins.get('FileRepository').createUploadAdapter = (loader) => {
  //   return new UploadAdapter(loader,this.sharedService);
  // };
  editor.ui.getEditableElement().parentElement.insertBefore(
    editor.ui.view.toolbar.element,
    editor.ui.getEditableElement()
  );

  const imageButton = document.createElement('button');
  imageButton.setAttribute('data-cke-tooltip-text', 'Insert Image');
  imageButton.classList.add('ck');
  imageButton.classList.add('ck-button');
  imageButton.classList.add('ck-off');
  imageButton.innerHTML = '<span class="ck-button"><img  src="./assets/images/icon/addimage.jpg" /></span>';

  imageButton.addEventListener('click', async () => {
//     if (this.editor) {
//       const selection = this.editor.model.document.selection;
//      console.log(selection)
// if (selection.hasOwnRange) { debugger;

//   const selectedRange = selection.getFirstRange();

//   // Check if the selected range is valid
//   if (selectedRange) {
//     let selectedText = '';

//     // Iterate through the selected range to collect text
//     for (const item of selectedRange.getItems()) {
//       if (item.is('text')) {
//         selectedText += item.data;
//       }
//     }

//     console.log(selectedText);
//   }
// }
//     }
    await this.handleImageInsert(editor);
  });

  const customButton = document.createElement('button');
  customButton.setAttribute('data-cke-tooltip-text', 'Media Handler');
  customButton.classList.add('ck');
  customButton.classList.add('ck-button');
  customButton.classList.add('ck-off');
  customButton.innerHTML = '<span class="ck-button"><img  src="./assets/images/icon/videoaudio.png" /></span>';

  customButton.addEventListener('click', async () => {
    // Handle the click event for your custom button
    await this.handleMediaHandler(editor);
  });

  const documentCustomButton = document.createElement('button');
  documentCustomButton.setAttribute('data-cke-tooltip-text', 'Insert Document');
  documentCustomButton.classList.add('ck');
  documentCustomButton.classList.add('ck-button');
  documentCustomButton.classList.add('ck-off');
  documentCustomButton.innerHTML = '<span class="ck-button"><img  src="./assets/images/icon/assignment_black_16px.png" /></span>';

  // Create a hidden file input
  const fileInput = document.createElement('input');
  fileInput.type = 'file';
  fileInput.style.display = 'none';

  documentCustomButton.addEventListener('click', () => {
    fileInput.click();
  });

  // Listen for file selection in the hidden file input
  fileInput.addEventListener('change', () => {
    this.handleFileSelection(editor, fileInput.files[0]);
  });



  const toolbarContainer = editor.ui.view.toolbar.element;
  const itemsContainer = toolbarContainer.querySelector('.ck-toolbar__items');
  if (this.isShowLimitedOptions == 'false') {
    itemsContainer.appendChild(customButton);
    itemsContainer.appendChild(imageButton)
  }
  itemsContainer.appendChild(documentCustomButton);


})

  .catch(error => {
    console.error(error);
  });

}