slint icon indicating copy to clipboard operation
slint copied to clipboard

Js: a slint´...´ template function

Open ogoffart opened this issue 5 months ago • 1 comments

Imagine:

import * as slint from "npm:slint-ui";
let demo = slint`
    import { AboutSlint } from "std-widgets.slint";
    export component Demo inherits Window { AboutSlint {} } 
`.Demo();
demo.show();
await slint.runEventLoop();

slint could be a tagged template that just calls loadSource Is it possible to have it both as a tagged template and as a "namespace" with the runEventLoop and other classes and interface?

Also we can extend the LSP and language to also highlight code in a slint` template the same way we highlight inside a rust macro. (Grep for extract_rust_macro and see slint.injections.json)

ogoffart avatar Jan 30 '24 11:01 ogoffart

Is it possible to have it both as a tagged template and as a "namespace" with the runEventLoop and other classes and interface?

I don't believe that is possible. It would have to be

import { slint }, * as the_rest from "slint-ui";
let instance = slint`...`;

I thought about this but I'm not sure anymore it's really worth the "convenience", for two reasons:

  • We can't make it type safe.
  • It's not an idiomatic use of template literals. We wouldn't really make use of templating after all - unless we add something like "inline" javascript handlers. But that brings in additional complications for the tooling.

If we want to have a way of creating a component instance from just a string, why don't we use a regular function?

let instance = slint.createInstanceFromString(export component App { ... });

tronical avatar Jan 30 '24 12:01 tronical