Textfield with background image

I am looking to create a textfield class that has an image associated with it, so that when a certain area of the textfield is clicked an action occurs.
Such as, a textfield with a background image of a calendar icon that opens a datepicker. (The datepicker would then enter the date in the textfield)

It could also be a textfield with an image that always appears to the right of the field when the field has focus.
I tried this approach by using a container with the image of the calendar icon which is shown with embedwithin just to the right of the textfield that appears when the field has focus. Creating the icon with embedwithin worked pretty well but it becomes quite difficult to remove the container when the field loses focus, possibly because the textfield could be in a container, groupbox or window (which for some reason seemed to make a difference).
I tried creating a property in the textfield that had a reference to the container created for that textfield but it was tough to get the container to close when the field lost focus. Sometimes it worked but then sometimes it didn’t close the container.

Is there an easy way to accomplish this?

Also, when I created the lost focus event in the class, it prohibits the lost focus event from being called separately for each instance of that class. Is there a way around this?

Funny: DesktopTextField (DTF) can receive a PictureDrop, but there is no Paint Event… (or whatever name it can be… Painted in Black ?)

https://documentation.xojo.com/api/user_interface/desktop/desktoptextfield.html#desktoptextfield

Maybe a canvas over the textfield that hides when clicked? Or just a canvas next to the textfield.

It would work on Mac where canvas is transparent. However, since 2018, Windows uses Direct2D where the canvas is opaque.