docs: Remove inline langref documentation and link the mdbook

For node and cpp, I use relative links to point to the slint language
reference documentation.

For the slint crate documentation I create a link to
https://slint-ui.com/releases/VERSION/... instead: This needs to work from
docs.rs as well as from our own docs area on slint-ui.com! That is
pretty ugly: I can not even define constants for this as the crate docs
need to come before anything else.

api/cpp/docs/index.rst

@@ -37,10 +37,6 @@ Welcome to Slint C++'s documentation!
 
    genindex
 
-   language.rst
-
-   markdown/debugging_techniques.md
-
 .. image:: https://github.com/slint-ui/slint/workflows/CI/badge.svg
    :target: https://github.com/slint-ui/slint/actions
    :alt: GitHub CI Build Status
@@ -73,7 +69,7 @@ of elements and property bindings. Here's the obligatory "Hello World":
         }
     }
 
-Check out the `language reference <markdown/langref.html>`_ for more details.
+Check out the `language reference <../slint>`_ for more details.
 
 Architecture
 ============

api/node/cover.md

@@ -0,0 +1,152 @@
+# Slint-node
+
+[![npm](https://img.shields.io/npm/v/slint-ui)](https://www.npmjs.com/package/slint-ui)
+
+[Slint](https://slint-ui.com/) is a UI toolkit that supports different programming languages.
+Slint-node is the integration with node.
+
+The complete Node documentation can be viewed online at https://slint-ui.com/docs/node/.
+
+**Warning: Pre-Alpha**
+Slint is still in the early stages of development: APIs will change and important features are still being developed.
+
+## Slint Language Manual
+
+The [Slint language manual](../slint) covers the Slint UI description language
+in detail.
+
+## Installing Slint
+
+Slint is available via NPM, so you can install by running the following command:
+
+```sh
+npm install slint-ui
+```
+
+## Using Slint
+
+To initialize the API, you first need to import the `slint-ui` module in our code:
+
+```js
+let slint = require("slint-ui");
+```
+
+This step also installs a hook in NodeJS that allows you to import `.slint` files directly:
+
+```js
+let ui = require("../ui/main.slint");
+```
+
+Combining these two steps leads us to the obligatory "Hello World" example:
+
+```js
+require("slint-ui");
+let ui = require("../ui/main.slint");
+let main = new ui.Main();
+main.run();
+```
+
+See [/examples/todo/node](/examples/todo/node) for a full example.
+
+## API Overview
+
+### Instantiating a component
+
+The exported 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.
+
+```js
+require("slint-ui");
+// In this example, the main.slint file exports a module which
+// has a counter property and a clicked callback
+let ui = require("ui/main.slint");
+let component = new ui.MainWindow({
+    counter: 42,
+    clicked: function() { console.log("hello"); }
+});
+```
+
+### Accessing a property
+
+Properties are exposed as properties on the component instance
+
+```js
+component.counter = 42;
+console.log(component.counter);
+```
+
+### Callbacks
+
+The callbacks are also exposed as property that have a setHandler function, and that can can be called.
+
+```js
+// connect to a callback
+component.clicked.setHandler(function() { console.log("hello"); })
+// emit a callback
+component.clicked();
+```
+
+### Type Mappings
+
+| `.slint` Type | JavaScript Type | Notes |
+| --- | --- | --- |
+| `int` | `Number` | |
+| `float` | `Number` | |
+| `string` | `String` | |
+| `color` | `String` | Colors are represented as strings in the form `"#rrggbbaa"`. When setting a color property, any CSS compliant color is accepted as a string. |
+| `length` | `Number` | |
+| `physical_length` | `Number` | |
+| `duration` | `Number` | The number of milliseconds |
+| `angle` | `Number` | The value in degrees |
+| structure | `Object` | Structures are mapped to JavaScrip objects with structure fields mapped to properties. |
+| array | `Array` or Model Object | |
+
+### Models
+
+For property of array type, they can either be set using an array.
+In that case, getting the property also return an array.
+If the array was set within the .slint file, the array can be obtained
+
+```js
+component.model = [1, 2, 3];
+// component.model.push(4); // does not work, because it operate on a copy
+// but re-assigning works
+component.model = component.model.concat(4);
+```
+
+Another option is to set a model object.  A model object has the following function:
+
+* `rowCount()`: returns the number of element in the model.
+* `rowData(index)`: return the row at the given index
+* `setRowData(index, data)`: called when the model need to be changed. `this.notify.rowDataChanged` must be called if successful.
+
+When such an object is set to a model property, it gets a new `notify` object with the following function
+
+* `rowDataChanged(index)`: notify the view that the row was changed.
+* `rowAdded(index, count)`: notify the view that rows were added.
+* `rowRemoved(index, count)`: notify the view that a row were removed.
+* `reset()`: notify the view that everything may have changed.
+
+As an example, here is the implementation of the `ArrayModel` (which is available as `slint.ArrayModel`)
+
+```js
+let array = [1, 2, 3];
+let model = {
+    rowCount() { return a.length; },
+    rowData(row) { return a[row]; },
+    setRowData(row, data) { a[row] = data; this.notify.rowDataChanged(row); },
+    push() {
+        let size = a.length;
+        Array.prototype.push.apply(a, arguments);
+        this.notify.rowAdded(size, arguments.length);
+    },
+    remove(index, size) {
+        let r = a.splice(index, size);
+        this.notify.rowRemoved(size, arguments.length);
+    },
+};
+component.model = model;
+model.push(4); // this works
+// does NOT work, getting the model does not return the right object
+// component.model.push(5);
+ ```

api/node/package.json

@@ -17,9 +17,9 @@
     "scripts": {
         "install": "neon build --release && tsc",
         "build": "tsc",
-        "docs": "typedoc lib/index.ts"
+        "docs": "typedoc --hideGenerator --readme cover.md lib/index.ts"
     },
     "devDependencies": {
         "typedoc": "^0.19.2"
     }
-}
+}

api/rs/slint/docs.rs

@@ -8,55 +8,15 @@
 
     - The [`generated_code`] module contains an [commented example](generated_code::SampleComponent)
       of what is generated from the `.slint` file
-    - The [`langref`] module is the reference documentation for the `.slint` language.
-    - The [`widgets`] and [`builtin_elements`] modules contains the documentation of elements usable
-      within the `.slint` files
-    - The [`layouting`] module contains the documentation to position the elements.
 */
 
 pub mod recipes {
     #![doc = include_str!("docs/recipes/recipes.md")]
-    //!
-    //! #
-    //! Next: [The `.slint` language reference](super::langref)
 
     // So intra-doc links can refer it as `slint::`
     use crate as slint;
 }
 
-pub mod langref {
-    #![doc = include_str!("docs/langref.md")]
-    //!
-    //! #
-    //! Next: [Builtin Elements](super::builtin_elements)
-}
-
-pub mod builtin_elements {
-    #![doc = include_str!("docs/builtin_elements.md")]
-    //!
-    //! #
-    //! Next: [Builtin Enums](super::builtin_enums)
-}
-
-pub mod builtin_enums {
-    #![doc = include_str!("docs/builtin_enums.md")]
-    //!
-    //! #
-    //! Next: [Widgets](super::widgets)
-}
-
-pub mod widgets {
-    #![doc = include_str!("docs/widgets.md")]
-    //!
-    //! #
-    //! Next: [Layouting](super::layouting)
-}
-
-pub mod layouting {
-    #![doc = include_str!("docs/layouting.md")]
-    #![doc = ""]
-}
-
 /// This module exists only to explain the API of the code generated from `.slint` design markup. Its described structure
 /// is not really contained in the compiled crate.
 pub mod generated_code {

api/rs/slint/lib.rs

@@ -8,19 +8,15 @@
 
 This crate is the main entry point for embedding user interfaces designed with
 [Slint UI](https://slint-ui.com/) in Rust programs.
-
-If you are new to Slint, start with the [Walk-through tutorial](https://slint-ui.com/docs/tutorial/rust).
-If you are already familiar with Slint, the following topics provide related information.
+*/
+#![doc = concat!("If you are new to Slint, start with the [Walk-through tutorial](https://slint-ui.com/releases/", env!("CARGO_PKG_VERSION"), "/tutorial/rust)")]
+/*! If you are already familiar with Slint, the following topics provide related information.
 
 ## Related topics
 
- * [Examples and Recipes](docs::recipes)
- * [The `.slint` language reference](docs::langref)
- * [Builtin Elements](docs::builtin_elements)
- * [Builtin Enums](docs::builtin_enums)
- * [Widgets](docs::widgets)
- * [Positioning and Layout of Elements](docs::layouting)
- * [Debugging Techniques](docs::debugging_techniques)
+*/
+#![doc = concat!("* [The Slint language reference manual](https://slint-ui.com/releases/", env!("CARGO_PKG_VERSION"), "/doc/slint)")]
+/*! * [Examples and Recipes](docs::recipes)
  * [Slint on Microcontrollers](docs::mcu)
 
 ## How to use this crate:
@@ -58,9 +54,9 @@ fn main() {
 
 ### The .slint code in external files is compiled with `build.rs`
 
-When your design becomes bigger in terms of markup code, you may want move it to a dedicated
-`.slint` file. It's also possible to split a `.slint` file into multiple files using [modules](docs::langref#modules).
-Use a [build script](https://doc.rust-lang.org/cargo/reference/build-scripts.html) to compile
+When your design becomes bigger in terms of markup code, you may want move it to a dedicated*/
+#![doc = concat!("`.slint` file. It's also possible to split a `.slint` file into multiple files using [modules](https://slint-ui.com/releases/", env!("CARGO_PKG_VERSION"), "/doc/slint/modules.html).")]
+/*!Use a [build script](https://doc.rust-lang.org/cargo/reference/build-scripts.html) to compile
 your main `.slint` file:
 
 In your Cargo.toml add a `build` assignment and use the `slint-build` crate in `build-dependencies`:
@@ -209,7 +205,7 @@ struct MyStruct {
 
 ## Exported Global singletons
 
-When you export a [global singleton](docs::langref#global-singletons) from the main file,
+When you export a [global singleton](../../slint/globals.html) from the main file,
 it is also generated with the exported name. Like the main component, the generated struct have
 inherent method to access the properties and callback: