it is a bit macro heavy

perhaps someone could make an addon

there is coconut.haxeui (https://github.com/MVCoconut/coconut.haxeui)

it's also used in haxe react

How do I use it? I download the repository and I add it my project? And How do I create and add a new code block to the project? Can you give an example of how to use it please?

So, i re-read your message, and actually, maybe its not what you want... are you looking for non editable code block?

ie, this in html:

<code>
x = 5;
y = 6;
z = x + y;
</code>

Yes

so, there isnt anything inbuilt that would create an html

<code>

block.. but you could very easily create a custom component to do so

gimme 10 mins, ill knock up one

Oh, okay, thanks :)

something like this:

haxe
class Code extends Component {
    private var _el:Element;
    
    private function new() {
        super();
        _el = Browser.document.createElement("code");
    }
    
    private override function onReady() {
        super.onReady();
        element.appendChild(_el);
        invalidateComponentLayout();
    }
    
    private override function set_text(value:String):String {
        if (_el != null) {
            _el.innerHTML = StringTools.replace(value, "\\n", "<br>");
        }
        return value;
    }
    
    private override function validateComponentLayout() {
        var b = super.validateComponentLayout();
        if (_el != null) {
            _el.style.width = HtmlUtils.px(width);
            _el.style.height = HtmlUtils.px(height);
        }
        return b;
    }
}

and in my `module.xml`:

xml
<module>
    <components>
        <class package="custom" />
    </components>
</module>

and in my UI:

xml
<code width="200" height="200" text="x = 5;\ny = 6;\nz = x + y;" style="border: 1px solid #CCCCCC;" />

... ... is that what you mean?

Yeah, thank you very much! So, what you do is creating a code html element, right? In the built project it will appear as and I can use a library like Prism to style it (in his page it says that it only works with elements)?

yup, exactly, you can manipulate the "_el" element in any way you wish (add classes that the prism lib will understand etc)

And how the module.xml works? I only need to put it in the source folder and nothing more?

yup, just put in the package and it will discover any components in there that extend

Component

that part is only if you want to use it from haxeui xml... if you are doing everything from code then that isnt needed

more info: https://github.com/haxeui/haxeui-guides/blob/master/modules.md

If my source folder has this structure, what should I put on the module.xml class tag?

I tried this, but it does not work

Maybe I'm missing something before "Code"

im just about to head out, for now i think you have to put it in a subfolder

i think there is a way not to have to, but i cant remember it now

(will have to look at the code)

(fyi - alias is no longer supported - .md is out of date)

It works now, I created a package called custom and I set the Code constructor to public. Thank you very much for your time Ian!

> I set the Code constructor to public haha - whoops - wonder how that worked for me