Rename npm package to slint-ui and fix up docs

This commit is contained in:
Simon Hausmann 2022-02-02 14:25:20 +01:00
parent d2d6a5cc6a
commit bd13fd2f27
10 changed files with 26 additions and 26 deletions

View file

@ -1,29 +1,29 @@
# SixtyFPS-node # Slint-node
[![npm](https://img.shields.io/npm/v/sixtyfps)](https://www.npmjs.com/package/sixtyfps) [![npm](https://img.shields.io/npm/v/slint-ui)](https://www.npmjs.com/package/slint-ui)
[SixtyFPS](https://sixtyfps.io/) is a UI toolkit that supports different programming languages. [Slint](https://sixtyfps.io/) is a UI toolkit that supports different programming languages.
SixtyFPS-node is the integration with node. Slint-node is the integration with node.
The complete C++ documentation can be viewed online at https://sixtyfps.io/docs/node/. The complete Node documentation can be viewed online at https://sixtyfps.io/docs/node/.
**Warning: Pre-Alpha** **Warning: Pre-Alpha**
SixtyFPS is still in the early stages of development: APIs will change and important features are still being developed. Slint is still in the early stages of development: APIs will change and important features are still being developed.
## Installing SixtyFPS ## Installing Slint
SixtyFPS is available via NPM, so you can install by running the following command: Slint is available via NPM, so you can install by running the following command:
```sh ```sh
npm install sixtyfps npm install slint-ui
``` ```
## Using SixtyFPS ## Using Slint
To initialize the API, you first need to import the `slint` module in our code: To initialize the API, you first need to import the `slint-ui` module in our code:
```js ```js
let slint = require("slint"); let slint = require("slint-ui");
``` ```
This step also installs a hook in NodeJS that allows you to import `.slint` files directly: This step also installs a hook in NodeJS that allows you to import `.slint` files directly:
@ -32,10 +32,10 @@ This step also installs a hook in NodeJS that allows you to import `.slint` file
let ui = require("../ui/main.slint"); let ui = require("../ui/main.slint");
``` ```
Combining these two steps leads us to the obligator "Hello World" example: Combining these two steps leads us to the obligatory "Hello World" example:
```js ```js
require("slint"); require("slint-ui");
let ui = require("../ui/main.slint"); let ui = require("../ui/main.slint");
let main = new ui.Main(); let main = new ui.Main();
main.run(); main.run();
@ -51,7 +51,7 @@ The exported component is exposed as a type constructor. The type constructor ta
an object which allow to initialize the value of public properties or callbacks. an object which allow to initialize the value of public properties or callbacks.
```js ```js
require("slint"); require("slint-ui");
// In this example, the main.slint file exports a module which // In this example, the main.slint file exports a module which
// has a counter property and a clicked callback // has a counter property and a clicked callback
let ui = require("ui/main.slint"); let ui = require("ui/main.slint");
@ -105,7 +105,7 @@ If the array was set within the .slint file, the array can be obtained
```js ```js
component.model = [1, 2, 3]; component.model = [1, 2, 3];
// component.model.push(4); // does not work, because it operate on a copy // component.model.push(4); // does not work, because it operate on a copy
// but re-assigning work // but re-assigning works
component.model = component.model.concat(4); component.model = component.model.concat(4);
``` ```
@ -121,7 +121,7 @@ When such an object is set to a model property, it gets a new `notify` object wi
* `rowAdded(index, count)`: notify the view that rows were added. * `rowAdded(index, count)`: notify the view that rows were added.
* `rowRemoved(index, count)`: notify the view that a row were removed. * `rowRemoved(index, count)`: notify the view that a row were removed.
As an example, here is the implementation of the `ArrayModel` (which is available on `sixtyfps.ArrayModel`) As an example, here is the implementation of the `ArrayModel` (which is available as `slint.ArrayModel`)
```js ```js
let array = [1, 2, 3]; let array = [1, 2, 3];

View file

@ -1,5 +1,5 @@
{ {
"name": "slint", "name": "slint-ui",
"version": "0.2.0", "version": "0.2.0",
"homepage": "https://github.com/sixtyfpsui/sixtyfps", "homepage": "https://github.com/sixtyfpsui/sixtyfps",
"license": "SEE LICENSE IN LICENSE.md", "license": "SEE LICENSE IN LICENSE.md",

View file

@ -2,7 +2,7 @@
// Copyright © SixtyFPS GmbH <info@sixtyfps.io> // Copyright © SixtyFPS GmbH <info@sixtyfps.io>
// SPDX-License-Identifier: (GPL-3.0-only OR LicenseRef-SixtyFPS-commercial) // SPDX-License-Identifier: (GPL-3.0-only OR LicenseRef-SixtyFPS-commercial)
let slint = require("slint"); let slint = require("slint-ui");
let ui = require("./memory.slint"); let ui = require("./memory.slint");
let window = new ui.MainWindow(); let window = new ui.MainWindow();

View file

@ -3,7 +3,7 @@
"version": "0.2.0", "version": "0.2.0",
"main": "main.js", "main": "main.js",
"dependencies": { "dependencies": {
"slint": "../../api/node" "slint-ui": "../../api/node"
}, },
"scripts": { "scripts": {
"start": "node ." "start": "node ."

View file

@ -3,7 +3,7 @@
// SPDX-License-Identifier: (GPL-3.0-only OR LicenseRef-SixtyFPS-commercial) // SPDX-License-Identifier: (GPL-3.0-only OR LicenseRef-SixtyFPS-commercial)
const path = require("path"); const path = require("path");
let slint = require("slint"); let slint = require("slint-ui");
let demo = require("../ui/printerdemo.slint"); let demo = require("../ui/printerdemo.slint");
let window = new demo.MainWindow(); let window = new demo.MainWindow();

View file

@ -3,7 +3,7 @@
"version": "0.2.0", "version": "0.2.0",
"main": "main.js", "main": "main.js",
"dependencies": { "dependencies": {
"slint": "../../../api/node" "slint-ui": "../../../api/node"
}, },
"scripts": { "scripts": {
"start": "node ." "start": "node ."

View file

@ -3,7 +3,7 @@
// SPDX-License-Identifier: (GPL-3.0-only OR LicenseRef-SixtyFPS-commercial) // SPDX-License-Identifier: (GPL-3.0-only OR LicenseRef-SixtyFPS-commercial)
// import "slint"; // import "slint";
require("slint"); require("slint-ui");
// import * as demo from "../ui/printerdemo.slint"; // import * as demo from "../ui/printerdemo.slint";
let demo = require("../ui/printerdemo.slint"); let demo = require("../ui/printerdemo.slint");
let window = new demo.MainWindow(); let window = new demo.MainWindow();

View file

@ -3,7 +3,7 @@
"version": "0.2.0", "version": "0.2.0",
"main": "main.js", "main": "main.js",
"dependencies": { "dependencies": {
"slint": "../../../api/node" "slint-ui": "../../../api/node"
}, },
"scripts": { "scripts": {
"start": "node ." "start": "node ."

View file

@ -3,7 +3,7 @@
// SPDX-License-Identifier: (GPL-3.0-only OR LicenseRef-SixtyFPS-commercial) // SPDX-License-Identifier: (GPL-3.0-only OR LicenseRef-SixtyFPS-commercial)
// import "slint"; // import "slint";
let slint = require("slint"); let slint = require("slint-ui");
// import * as demo from "../ui/todo.slint"; // import * as demo from "../ui/todo.slint";
let demo = require("../ui/todo.slint"); let demo = require("../ui/todo.slint");
let app = new demo.MainWindow(); let app = new demo.MainWindow();

View file

@ -3,7 +3,7 @@
"version": "0.2.0", "version": "0.2.0",
"main": "main.js", "main": "main.js",
"dependencies": { "dependencies": {
"slint": "../../../api/node" "slint-ui": "../../../api/node"
}, },
"scripts": { "scripts": {
"start": "node ." "start": "node ."