Features Request: add loadFromDir to Ts/Js

[felipetesc]

I want to suggest/request, if possible, the addition of a new feature to the Node/Deno/Bun API. That's, to add a new method which is a mixture of slint.loadSource and slint.loadFile. Unfortunetelly we can't achieve this with both methods.

This new method could be called loadFromDir(pathToMainFile : string); , and it would navigate through the list of user interfaces created with .slint files located at the pathtoMainFile and would transform all the app ui's tree into a collection of strings, so we can embed the ui using bun compile, or deno compile. Like this we can hide, or embed our user interfaces inside the binary.

Used Platforms:
ArchLinux x64
16GB
KDE Plasma 6.1.5
Wayland
Windows x64
16GB
Windows 11

Thanks in advance.

P.S.:Maybe the same can be done to Python and use freeze and similar libs?

[tronical]

Interesting idea. How would you implement the embedding if such a function existed?

[felipetesc]

Interesting idea. How would you implement the embedding if such a function existed?

Perhaps creating a recursive rust function which uses include_bytes!() inside of it

[felipetesc]

Interesting idea. How would you implement the embedding if such a function existed?

Perhaps creating a recursive rust function which uses include_bytes!() inside of it

And exposing to the API at https://github.com/slint-ui/slint/tree/master/api/node/src

[tronical]

Hmm, include_bytes! is a macro though, that doesn't work from JavaScript. Could it be that you're looking for a Node/Bun/Deno feature here instead of a Slint one? Or perhaps a bundler plugin?

[felipetesc]

Is this the part responsible for building the source on NodeJS ?

#[napi]
    pub fn build_from_source(
        &mut self,
        source_code: String,
        path: String,
    ) -> HashMap<String, JsComponentDefinition> {
        let r = spin_on::spin_on(self.internal.build_from_source(source_code, PathBuf::from(path)));
        self.diagnostics = r.diagnostics().collect();
        r.components().map(|c| (c.name().to_owned(), c.into())).collect()
    }

[felipetesc]

Hmm, include_bytes! is a macro though, that doesn't work from JavaScript. Could it be that you're looking for a Node/Bun/Deno feature here instead of a Slint one? Or perhaps a bundler plugin?

Yes, did I sent this post to the wrong place ?

Yes, you're calling/using NAPI from napi-rs

[felipetesc]

bundler plugin

Yes

[felipetesc]

The functionality is actually easy to be implemented using TS

function bundle_ui(path: string){
    const fileNames = readdirSync( path );
    const filePaths = fileNames.map( fn => join( path, fn ) );
    var contents = "";
    filePaths.forEach(path => {
        //log(path)
        const file = readFileSync(path);
        contents = file.toString('utf8') + contents;
    });
    
    writeFileSync("ui.slint", contents);
    
}

bundle_ui("./ui/")

A problem arises from correctly importing slint types, so we don't have duplicated component imports. I wonder if it's possible to add a function inside slint interpreter to strip all the imports and to generate a single header which can be added to the top of the bundled slint file with the function slint.loadFile("./ui.slint")

[felipetesc]

What about exposing slint_build::compile("ui/appwindow.slint").unwrap() to js/ts/python, and so own ?

[ogoffart]

How would that work? There is no "compile" phase in javascript.

I think you're trying to solve the issue that you must ship the UI alongside with the js file.
This is common in JS project where the JS project is the whole folder (+ node)
Are you using a specific blunder already? The thing that needs to be done here is to make sure that the bundler bundle the slint files.

(Note I've converted this from an issue to a discussion, since it doesn't seem like this is an actionable issue)

[FloVanGH]

There is also a port of cargo packager for nodejs, maybe that could help to bundle the slint files with the nodejs stuff as app https://github.com/crabnebula-dev/cargo-packager/tree/main/bindings/packager/nodejs. But I haven't tried it yet.

[sigmaSd]

deno compile have --include flag that can be used to embed files or directories, I'm already using it with slint files and it does work (though u have to workaround a couple of stuff to make deno compiled binary actually work)