slint-ui 1.7.0-nightly.2024070208 → 1.7.0-nightly.2024070318

package/Cargo.toml

@@ -40,10 +40,10 @@ accessibility = ["slint-interpreter/accessibility"]
 [dependencies]
 napi = { version = "2.14.0", default-features = false, features = ["napi8"] }
 napi-derive = "2.14.0"
-i-slint-compiler = { features = ["default"] , git = "https://github.com/slint-ui/slint", rev = "a24c04fd84d53879d5cc389c78af8d4d334e6a6a", version = "=1.7.0", default-features = false }
-i-slint-core = { features = ["default"] , git = "https://github.com/slint-ui/slint", rev = "a24c04fd84d53879d5cc389c78af8d4d334e6a6a", version = "=1.7.0", default-features = false }
-i-slint-backend-selector = { git = "https://github.com/slint-ui/slint", rev = "a24c04fd84d53879d5cc389c78af8d4d334e6a6a", version = "=1.7.0", default-features = false }
-slint-interpreter = { default-features = false , features = ["display-diagnostics", "internal", "compat-1-2"] , git = "https://github.com/slint-ui/slint", rev = "a24c04fd84d53879d5cc389c78af8d4d334e6a6a", version = "=1.7.0"}
+i-slint-compiler = { features = ["default"] , git = "https://github.com/slint-ui/slint", rev = "8117e9b29cb7fd744b7c3bc13eae09b6a2b18af3", version = "=1.7.0", default-features = false }
+i-slint-core = { features = ["default"] , git = "https://github.com/slint-ui/slint", rev = "8117e9b29cb7fd744b7c3bc13eae09b6a2b18af3", version = "=1.7.0", default-features = false }
+i-slint-backend-selector = { git = "https://github.com/slint-ui/slint", rev = "8117e9b29cb7fd744b7c3bc13eae09b6a2b18af3", version = "=1.7.0", default-features = false }
+slint-interpreter = { default-features = false , features = ["display-diagnostics", "internal", "compat-1-2"] , git = "https://github.com/slint-ui/slint", rev = "8117e9b29cb7fd744b7c3bc13eae09b6a2b18af3", version = "=1.7.0"}
 spin_on = { version = "0.1" }
 css-color-parser2 = { version = "1.0.1" }
 itertools = { version = "0.13" }

package/README.md

@@ -85,7 +85,7 @@ export component MainWindow inherits Window {
 }
 ```
 
-The exported component is exposed as a type constructor. The type constructor takes as parameter
+Each exported Window component is exposed as a type constructor. The type constructor takes as parameter
 an object which allow to initialize the value of public properties or callbacks.
 
 **`main.js`**
@@ -144,6 +144,37 @@ component.clicked = function() { console.log("hello"); };
 component.clicked();
 ```
 
+### Functions
+
+Functions in Slint can be defined using the `function` keyword.
+
+**`ui/my-component.slint`**
+
+```slint
+export component MyComponent inherits Window {
+    width: 400px;
+    height: 200px;
+
+    public function my-function() -> int {
+        return 42;
+    }
+}
+```
+
+If the function is marked `public`, it can also be called from JavaScript.
+
+**`main.js`**
+
+```js
+import * as slint from "slint-ui";
+
+let ui = slint.loadFile("ui/my-component.slint");
+let component = new ui.MyComponent();
+
+// call a public function
+let result = component.my_function();
+```
+
 ### Type Mappings
 
 The types used for properties in .slint design markup each translate to specific types in JavaScript. The follow table summarizes the entire mapping:

package/index.d.ts

@@ -476,13 +476,13 @@ export interface LoadFileOptions {
     libraryPaths?: Record<string, string>;
 }
 /**
- * Loads the given Slint file and returns an objects that contains a functions to construct the exported
- * component of the slint file.
+ * Loads the specified Slint file and returns an object containing functions to construct the exported
+ * components defined within the Slint file.
  *
  * The following example loads a "Hello World" style Slint file and changes the Text label to a new greeting:
- * `main.slint`:
+ * **`main.slint`**:
  * ```
- * export component Main {
+ * export component Main inherits Window {
  *     in-out property <string> greeting <=> label.text;
  *     label := Text {
  *         text: "Hello World";
@@ -490,28 +490,27 @@ export interface LoadFileOptions {
  * }
  * ```
  *
- * ```js
+ * **`index.js`**:
+ * ```javascript
  * import * as slint from "slint-ui";
  * let ui = slint.loadFile("main.slint");
  * let main = new ui.Main();
  * main.greeting = "Hello friends";
  * ```
  *
- * @param filePath A path to the file to load. If the path is a relative path, then it is resolved
- *                 against the process' working directory.
- * @param options Use {@link LoadFileOptions} to configure additional Slint compilation aspects,
+ * @param filePath The path to the file to load. Relative paths are resolved against the process' current working directory.
+ * @param options An optional {@link LoadFileOptions} to configure additional Slint compilation settings,
  *                such as include search paths, library imports, or the widget style.
- * @returns The returned object is sealed and provides a property by the name of the component exported
- *          in the `.slint` file. In the above example the name of the property is `Main`. The property
- *          is a constructor function. Use it with the new operator to instantiate the component.
- *          The instantiated object exposes properties and callbacks, and implements the {@link ComponentHandle} interface.
- *          For more details about the exposed properties, see [Instantiating A Component](../index.html#md:instantiating-a-component).
+ * @returns Returns an object that is immutable and provides a constructor function for each exported Window component found in the `.slint` file.
+ *          For instance, in the example above, a `Main` property is available, which can be used to create instances of the `Main` component using the `new` keyword.
+ *          These instances offer properties and event handlers, adhering to the {@link ComponentHandle} interface.
+ *          For further information on the available properties, refer to [Instantiating A Component](../index.html#md:instantiating-a-component).
  * @throws {@link CompileError} if errors occur during compilation.
  */
 export declare function loadFile(filePath: string, options?: LoadFileOptions): Object;
 /**
- * Loads the given Slint source code and returns an object that contains a function to construct the exported
- * component of the Slint source code.
+ * Loads the given Slint source code and returns an object that contains a functions to construct the exported
+ * components of the Slint source code.
  *
  * The following example loads a "Hello World" style Slint source code and changes the Text label to a new greeting:
  * ```js
@@ -527,15 +526,14 @@ export declare function loadFile(filePath: string, options?: LoadFileOptions): O
  * main.greeting = "Hello friends";
  * ```
  * @param source The Slint source code to load.
- * @param filePath A path to the file to show log. If the path is a relative path, then it is resolved
- *                 against the process' working directory.
- * @param options Use {@link LoadFileOptions} to configure additional Slint compilation aspects,
+ * @param filePath A path to the file to show log and resolve relative import and images.
+ *                 Relative paths are resolved against the process' current working directory.
+ * @param options An optional {@link LoadFileOptions} to configure additional Slint compilation settings,
  *                such as include search paths, library imports, or the widget style.
- * @returns The returned object is sealed and provides a property by the name of the component exported
- *          in the `.slint` file. In the above example the name of the property is `Main`. The property
- *          is a constructor function. Use it with the new operator to instantiate the component.
- *          The instantiated object exposes properties and callbacks, and implements the {@link ComponentHandle} interface.
- *          For more details about the exposed properties, see [Instantiating A Component](../index.html#md:instantiating-a-component).
+ * @returns Returns an object that is immutable and provides a constructor function for each exported Window component found in the `.slint` file.
+ *          For instance, in the example above, a `Main` property is available, which can be used to create instances of the `Main` component using the `new` keyword.
+ *          These instances offer properties and event handlers, adhering to the {@link ComponentHandle} interface.
+ *          For further information on the available properties, refer to [Instantiating A Component](../index.html#md:instantiating-a-component).
  * @throws {@link CompileError} if errors occur during compilation.
  */
 export declare function loadSource(source: string, filePath: string, options?: LoadFileOptions): Object;

package/index.js

@@ -452,7 +452,7 @@ function loadSlint(loadData) {
             compiler.libraryPaths = options.libraryPaths;
         }
     }
-    let definition = loadData.from === 'file' ? compiler.buildFromPath(filePath) : compiler.buildFromSource(loadData.fileData.source, filePath);
+    let definitions = loadData.from === 'file' ? compiler.buildFromPath(filePath) : compiler.buildFromSource(loadData.fileData.source, filePath);
     let diagnostics = compiler.diagnostics;
     if (diagnostics.length > 0) {
         let warnings = diagnostics.filter((d) => d.level == napi.DiagnosticLevel.Warning);
@@ -465,154 +465,157 @@ function loadSlint(loadData) {
         }
     }
     let slint_module = Object.create({});
-    Object.defineProperty(slint_module, definition.name.replace(/-/g, "_"), {
-        value: function (properties) {
-            let instance = definition.create();
-            if (instance == null) {
-                throw Error("Could not create a component handle for" + filePath);
-            }
-            for (var key in properties) {
-                let value = properties[key];
-                if (value instanceof Function) {
-                    instance.setCallback(key, value);
-                }
-                else {
-                    instance.setProperty(key, properties[key]);
-                }
-            }
-            let componentHandle = new Component(instance);
-            instance.definition().properties.forEach((prop) => {
-                let propName = prop.name.replace(/-/g, "_");
-                if (componentHandle[propName] !== undefined) {
-                    console.warn("Duplicated property name " + propName);
-                }
-                else {
-                    Object.defineProperty(componentHandle, propName, {
-                        get() {
-                            return instance.getProperty(prop.name);
-                        },
-                        set(value) {
-                            instance.setProperty(prop.name, value);
-                        },
-                        enumerable: true,
-                    });
-                }
-            });
-            instance.definition().callbacks.forEach((cb) => {
-                let callbackName = cb.replace(/-/g, "_");
-                if (componentHandle[callbackName] !== undefined) {
-                    console.warn("Duplicated callback name " + callbackName);
-                }
-                else {
-                    Object.defineProperty(componentHandle, cb.replace(/-/g, "_"), {
-                        get() {
-                            return function () {
-                                return instance.invoke(cb, Array.from(arguments));
-                            };
-                        },
-                        set(callback) {
-                            instance.setCallback(cb, callback);
-                        },
-                        enumerable: true,
-                    });
+    Object.keys(definitions).forEach((key) => {
+        let definition = definitions[key];
+        Object.defineProperty(slint_module, definition.name.replace(/-/g, "_"), {
+            value: function (properties) {
+                let instance = definition.create();
+                if (instance == null) {
+                    throw Error("Could not create a component handle for" + filePath);
                 }
-            });
-            instance.definition().functions.forEach((cb) => {
-                let functionName = cb.replace(/-/g, "_");
-                if (componentHandle[functionName] !== undefined) {
-                    console.warn("Duplicated function name " + functionName);
-                }
-                else {
-                    Object.defineProperty(componentHandle, cb.replace(/-/g, "_"), {
-                        get() {
-                            return function () {
-                                return instance.invoke(cb, Array.from(arguments));
-                            };
-                        },
-                        enumerable: true,
-                    });
-                }
-            });
-            // globals
-            instance.definition().globals.forEach((globalName) => {
-                if (componentHandle[globalName] !== undefined) {
-                    console.warn("Duplicated property name " + globalName);
+                for (var key in properties) {
+                    let value = properties[key];
+                    if (value instanceof Function) {
+                        instance.setCallback(key, value);
+                    }
+                    else {
+                        instance.setProperty(key, properties[key]);
+                    }
                 }
-                else {
-                    let globalObject = Object.create({});
-                    instance.definition().globalProperties(globalName).forEach((prop) => {
-                        let propName = prop.name.replace(/-/g, "_");
-                        if (globalObject[propName] !== undefined) {
-                            console.warn("Duplicated property name " + propName + " on global " + global);
-                        }
-                        else {
-                            Object.defineProperty(globalObject, propName, {
-                                get() {
-                                    return instance.getGlobalProperty(globalName, prop.name);
-                                },
-                                set(value) {
-                                    instance.setGlobalProperty(globalName, prop.name, value);
-                                },
-                                enumerable: true,
-                            });
-                        }
-                    });
-                    instance.definition().globalCallbacks(globalName).forEach((cb) => {
-                        let callbackName = cb.replace(/-/g, "_");
-                        if (globalObject[callbackName] !== undefined) {
-                            console.warn("Duplicated property name " + cb + " on global " + global);
-                        }
-                        else {
-                            Object.defineProperty(globalObject, cb.replace(/-/g, "_"), {
-                                get() {
-                                    return function () {
-                                        return instance.invokeGlobal(globalName, cb, Array.from(arguments));
-                                    };
-                                },
-                                set(callback) {
-                                    instance.setGlobalCallback(globalName, cb, callback);
-                                },
-                                enumerable: true,
-                            });
-                        }
-                    });
-                    instance.definition().globalFunctions(globalName).forEach((cb) => {
-                        let functionName = cb.replace(/-/g, "_");
-                        if (globalObject[functionName] !== undefined) {
-                            console.warn("Duplicated function name " + cb + " on global " + global);
-                        }
-                        else {
-                            Object.defineProperty(globalObject, cb.replace(/-/g, "_"), {
-                                get() {
-                                    return function () {
-                                        return instance.invokeGlobal(globalName, cb, Array.from(arguments));
-                                    };
-                                },
-                                enumerable: true,
-                            });
-                        }
-                    });
-                    Object.defineProperty(componentHandle, globalName, {
-                        get() {
-                            return globalObject;
-                        },
-                        enumerable: true,
-                    });
-                }
-            });
-            return Object.seal(componentHandle);
-        },
+                let componentHandle = new Component(instance);
+                instance.definition().properties.forEach((prop) => {
+                    let propName = prop.name.replace(/-/g, "_");
+                    if (componentHandle[propName] !== undefined) {
+                        console.warn("Duplicated property name " + propName);
+                    }
+                    else {
+                        Object.defineProperty(componentHandle, propName, {
+                            get() {
+                                return instance.getProperty(prop.name);
+                            },
+                            set(value) {
+                                instance.setProperty(prop.name, value);
+                            },
+                            enumerable: true,
+                        });
+                    }
+                });
+                instance.definition().callbacks.forEach((cb) => {
+                    let callbackName = cb.replace(/-/g, "_");
+                    if (componentHandle[callbackName] !== undefined) {
+                        console.warn("Duplicated callback name " + callbackName);
+                    }
+                    else {
+                        Object.defineProperty(componentHandle, cb.replace(/-/g, "_"), {
+                            get() {
+                                return function () {
+                                    return instance.invoke(cb, Array.from(arguments));
+                                };
+                            },
+                            set(callback) {
+                                instance.setCallback(cb, callback);
+                            },
+                            enumerable: true,
+                        });
+                    }
+                });
+                instance.definition().functions.forEach((cb) => {
+                    let functionName = cb.replace(/-/g, "_");
+                    if (componentHandle[functionName] !== undefined) {
+                        console.warn("Duplicated function name " + functionName);
+                    }
+                    else {
+                        Object.defineProperty(componentHandle, cb.replace(/-/g, "_"), {
+                            get() {
+                                return function () {
+                                    return instance.invoke(cb, Array.from(arguments));
+                                };
+                            },
+                            enumerable: true,
+                        });
+                    }
+                });
+                // globals
+                instance.definition().globals.forEach((globalName) => {
+                    if (componentHandle[globalName] !== undefined) {
+                        console.warn("Duplicated property name " + globalName);
+                    }
+                    else {
+                        let globalObject = Object.create({});
+                        instance.definition().globalProperties(globalName).forEach((prop) => {
+                            let propName = prop.name.replace(/-/g, "_");
+                            if (globalObject[propName] !== undefined) {
+                                console.warn("Duplicated property name " + propName + " on global " + global);
+                            }
+                            else {
+                                Object.defineProperty(globalObject, propName, {
+                                    get() {
+                                        return instance.getGlobalProperty(globalName, prop.name);
+                                    },
+                                    set(value) {
+                                        instance.setGlobalProperty(globalName, prop.name, value);
+                                    },
+                                    enumerable: true,
+                                });
+                            }
+                        });
+                        instance.definition().globalCallbacks(globalName).forEach((cb) => {
+                            let callbackName = cb.replace(/-/g, "_");
+                            if (globalObject[callbackName] !== undefined) {
+                                console.warn("Duplicated property name " + cb + " on global " + global);
+                            }
+                            else {
+                                Object.defineProperty(globalObject, cb.replace(/-/g, "_"), {
+                                    get() {
+                                        return function () {
+                                            return instance.invokeGlobal(globalName, cb, Array.from(arguments));
+                                        };
+                                    },
+                                    set(callback) {
+                                        instance.setGlobalCallback(globalName, cb, callback);
+                                    },
+                                    enumerable: true,
+                                });
+                            }
+                        });
+                        instance.definition().globalFunctions(globalName).forEach((cb) => {
+                            let functionName = cb.replace(/-/g, "_");
+                            if (globalObject[functionName] !== undefined) {
+                                console.warn("Duplicated function name " + cb + " on global " + global);
+                            }
+                            else {
+                                Object.defineProperty(globalObject, cb.replace(/-/g, "_"), {
+                                    get() {
+                                        return function () {
+                                            return instance.invokeGlobal(globalName, cb, Array.from(arguments));
+                                        };
+                                    },
+                                    enumerable: true,
+                                });
+                            }
+                        });
+                        Object.defineProperty(componentHandle, globalName, {
+                            get() {
+                                return globalObject;
+                            },
+                            enumerable: true,
+                        });
+                    }
+                });
+                return Object.seal(componentHandle);
+            },
+        });
     });
     return Object.seal(slint_module);
 }
 /**
- * Loads the given Slint file and returns an objects that contains a functions to construct the exported
- * component of the slint file.
+ * Loads the specified Slint file and returns an object containing functions to construct the exported
+ * components defined within the Slint file.
  *
  * The following example loads a "Hello World" style Slint file and changes the Text label to a new greeting:
- * `main.slint`:
+ * **`main.slint`**:
  * ```
- * export component Main {
+ * export component Main inherits Window {
  *     in-out property <string> greeting <=> label.text;
  *     label := Text {
  *         text: "Hello World";
@@ -620,22 +623,21 @@ function loadSlint(loadData) {
  * }
  * ```
  *
- * ```js
+ * **`index.js`**:
+ * ```javascript
  * import * as slint from "slint-ui";
  * let ui = slint.loadFile("main.slint");
  * let main = new ui.Main();
  * main.greeting = "Hello friends";
  * ```
  *
- * @param filePath A path to the file to load. If the path is a relative path, then it is resolved
- *                 against the process' working directory.
- * @param options Use {@link LoadFileOptions} to configure additional Slint compilation aspects,
+ * @param filePath The path to the file to load. Relative paths are resolved against the process' current working directory.
+ * @param options An optional {@link LoadFileOptions} to configure additional Slint compilation settings,
  *                such as include search paths, library imports, or the widget style.
- * @returns The returned object is sealed and provides a property by the name of the component exported
- *          in the `.slint` file. In the above example the name of the property is `Main`. The property
- *          is a constructor function. Use it with the new operator to instantiate the component.
- *          The instantiated object exposes properties and callbacks, and implements the {@link ComponentHandle} interface.
- *          For more details about the exposed properties, see [Instantiating A Component](../index.html#md:instantiating-a-component).
+ * @returns Returns an object that is immutable and provides a constructor function for each exported Window component found in the `.slint` file.
+ *          For instance, in the example above, a `Main` property is available, which can be used to create instances of the `Main` component using the `new` keyword.
+ *          These instances offer properties and event handlers, adhering to the {@link ComponentHandle} interface.
+ *          For further information on the available properties, refer to [Instantiating A Component](../index.html#md:instantiating-a-component).
  * @throws {@link CompileError} if errors occur during compilation.
  */
 function loadFile(filePath, options) {
@@ -646,8 +648,8 @@ function loadFile(filePath, options) {
 }
 exports.loadFile = loadFile;
 /**
- * Loads the given Slint source code and returns an object that contains a function to construct the exported
- * component of the Slint source code.
+ * Loads the given Slint source code and returns an object that contains a functions to construct the exported
+ * components of the Slint source code.
  *
  * The following example loads a "Hello World" style Slint source code and changes the Text label to a new greeting:
  * ```js
@@ -663,15 +665,14 @@ exports.loadFile = loadFile;
  * main.greeting = "Hello friends";
  * ```
  * @param source The Slint source code to load.
- * @param filePath A path to the file to show log. If the path is a relative path, then it is resolved
- *                 against the process' working directory.
- * @param options Use {@link LoadFileOptions} to configure additional Slint compilation aspects,
+ * @param filePath A path to the file to show log and resolve relative import and images.
+ *                 Relative paths are resolved against the process' current working directory.
+ * @param options An optional {@link LoadFileOptions} to configure additional Slint compilation settings,
  *                such as include search paths, library imports, or the widget style.
- * @returns The returned object is sealed and provides a property by the name of the component exported
- *          in the `.slint` file. In the above example the name of the property is `Main`. The property
- *          is a constructor function. Use it with the new operator to instantiate the component.
- *          The instantiated object exposes properties and callbacks, and implements the {@link ComponentHandle} interface.
- *          For more details about the exposed properties, see [Instantiating A Component](../index.html#md:instantiating-a-component).
+ * @returns Returns an object that is immutable and provides a constructor function for each exported Window component found in the `.slint` file.
+ *          For instance, in the example above, a `Main` property is available, which can be used to create instances of the `Main` component using the `new` keyword.
+ *          These instances offer properties and event handlers, adhering to the {@link ComponentHandle} interface.
+ *          For further information on the available properties, refer to [Instantiating A Component](../index.html#md:instantiating-a-component).
  * @throws {@link CompileError} if errors occur during compilation.
  */
 function loadSource(source, filePath, options) {