Add images, using the rich text editor

Hello,
How can I upload images from the visual editor in an input of type “richText”? I was able to add one, by manually adding an img html tag, using the “Edit as code” button; then, when I came back to the rich text editor, the image was there. My goal is NOT to use that approach and use the rich text editor only. I need the attached images to be uploaded to the CDN.

Here is my component:

Builder.registerComponent(MyComponent, {
  name: "MyComponent",
  inputs: [
    {
       name: "description",
       type: "richText",
       defaultValue: "",
    }
  ]
});

Here is how I was able to upload the image, by manually typing the img html tag:

  1. I clicked on the “Edit as code” button

  2. Added the following code
    <img src="https://d38b044pevnwc9.cloudfront.net/cutout-nuxt/enhancer/2.jpg" />
    Screenshot 2024-05-15 at 16.15.43

  3. Clicked the “Edit as code” button again to return back to the rich text editor

  4. The image was embedded in the rich text editor

Screen recoding: https://file.io/31c8h5WevuBB

Update: I was also able to drag and drop an image, but then the image was stored as a base64, which is NOT my goal. I want to upload the image to the CDN.