Change color of Text by using Actions?

[JempNobod]

Hi, I was wondering if it possible to change color of the Text by clicking on different Actions.
Basically like what I did for Line:

const actionsLine = [
    // create color changing actions
    {
        text: "Rot",
        onClick: () => {
            //console.log("Chage to red")
            const lineStyleOptions = {
                // Change helper line style
                pathOptions: {
                    color: 'red',
                },
                hintlineStyle: {
                    color: 'red',
                    dashArray: "5,5",
                }
            }
            map.pm.Draw.Line.setOptions(lineStyleOptions)
        },
        name: "redLine"
    },
    ...
map.pm.Toolbar.changeActionsOfControl("Line", actionsLine)

Before creating the Line I can choose which color it should be.
But Text does not seem to have the Option "color" but the way to change the color of the text is by getting HTMLElement and adding CSS style like so:
layer.pm.getElement().style.color = "red";

However I cannot get that HTMLElement when it does not yet exist but is about to be created, so I can't change colors that way or I might be missing something.

Anyone has an idea? please

[JempNobod]

I solved it with the following code.
Basically, I added a control to the map letting the user choose the color.

Everytime the user clicks on a different color button, Line.setOptions(...) gets called to set the right color for the line and for the text I just set it on the event "map.on(pm:create)".

let currentChoosenColor = "#0000ff"; // Default blue
const colorControl = L.control({ position: 'topright' });

colorControl.onAdd = function () 
     const div = L.DomUtil.create('div', 'leaflet-bar');
      ...
     [div.style options]
     ...

    //Set color options 
    const colors = [
        { name: 'Blue', value: '#0000ff' },
        { name: 'Red', value: '#ff0000' },
        { name: 'Purple', value: '#800080' },
        { name: 'Green', value: '#008000' }
    ];

    colors.forEach(color => {
        const btn = document.createElement('button');
        ...
        [btn.style options]
        ...

        // Highlight selected
        if (color.value === currentChoosenColor) {
            btn.style.borderColor = '#000';
        }

        btn.addEventListener('click', () => {
            currentChoosenColor = color.value;
            
            const lineStyleOptions = {
                // Change helper line style
                pathOptions: {
                    color: currentChoosenColor,
                },
                hintlineStyle: {
                    color: currentChoosenColor,
                    dashArray: "5,5",
                }
            }
            map.pm.Draw.Line.setOptions(lineStyleOptions)

            // Visually show selected color
            div.querySelectorAll('button').forEach(b => b.style.borderColor = 'transparent');
            btn.style.borderColor = '#000';
        });

        div.appendChild(btn);
    });

    L.DomEvent.disableClickPropagation(div);
    return div;
};

colorControl.addTo(map);
...
...


map.on('pm:create', (e) => {
...
else if (e.shape === 'Text') {
        e.layer.pm.getElement().style.color = currentChoosenColor;
    }
...
});