Versionize links to the C++/Rust/Node.js docs

Fixes #7368
This commit is contained in:
Simon Hausmann 2025-01-31 13:50:17 +01:00 committed by Simon Hausmann
parent b5661ab754
commit d31ee19ee2
12 changed files with 89 additions and 30 deletions

View file

@ -6,7 +6,13 @@ import starlight from "@astrojs/starlight";
import starlightLinksValidator from "starlight-links-validator";
import rehypeExternalLinks from "rehype-external-links";
import starlightSidebarTopics from "starlight-sidebar-topics";
import { BASE_PATH, BASE_URL } from "./src/utils/site-config";
import {
BASE_PATH,
BASE_URL,
CPP_BASE_URL,
RUST_SLINT_CRATE_URL,
NODEJS_BASE_URL,
} from "./src/utils/site-config";
// https://astro.build/config
export default defineConfig({
@ -380,12 +386,12 @@ export default defineConfig({
items: [
{
label: "C++ ↗",
link: "https://docs.slint.dev/latest/docs/cpp/",
link: `${CPP_BASE_URL}`,
attrs: { target: "_blank" },
},
{
label: "Rust ↗",
link: "https://docs.slint.dev/latest/docs/rust/slint/",
link: `${RUST_SLINT_CRATE_URL}`,
attrs: { target: "_blank" },
},
{
@ -394,7 +400,7 @@ export default defineConfig({
text: "beta",
variant: "caution",
},
link: "https://docs.slint.dev/latest/docs/node/",
link: `${NODEJS_BASE_URL}`,
attrs: { target: "_blank" },
},
],

View file

@ -0,0 +1,39 @@
---
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
import {
CPP_BASE_URL,
RUST_SLINT_CRATE_URL,
RUST_SLINT_INTERPRETER_CRATE_URL,
RUST_SLINT_BUILD_CRATE_URL,
NODEJS_BASE_URL,
} from "../utils/site-config.ts";
const BASE_URL_MAP = {
cpp: `${CPP_BASE_URL}`,
"rust-slint": `${RUST_SLINT_CRATE_URL}`,
"rust-slint-build": `${RUST_SLINT_BUILD_CRATE_URL}`,
"rust-slint-interpreter": `${RUST_SLINT_INTERPRETER_CRATE_URL}`,
nodejs: `${NODEJS_BASE_URL}`,
} as const;
type LangID = keyof typeof BASE_URL_MAP;
interface Props {
lang: LangID;
title: string;
relpath: string;
}
const props = Astro.props;
if (!Object.keys(BASE_URL_MAP).includes(props.lang)) {
throw new Error(`Invalid language ID: ${props.lang}`);
}
const { lang, relpath } = props;
const link = `${BASE_URL_MAP[lang]}${relpath}`;
---
<a href={link}><slot/></a>

View file

@ -6,6 +6,7 @@ description: Backends & Renderers
---
import Link from '/src/components/Link.astro';
import LangRefLink from '/src/components/LangRefLink.astro';
In Slint, a backend is the module that encapsulates the interaction with the operating system,
@ -69,7 +70,7 @@ The Qt renderer comes with the <Link type="QtBackend" label="Qt backend" /> and
* No text stroking/outlining.
- Text rendering currently limited to western scripts.
- Available in the <Link type="WinitBackend" label="Winit backend" />.
- Public [Rust](slint-rust:platform/software_renderer/) and [C++](https://slint.dev/docs/cpp/api/classslint_1_1platform_1_1SoftwareRenderer) API.
- Public [Rust](slint-rust:platform/software_renderer/) and <LangRefLink lang="cpp" relpath="api/classslint_1_1platform_1_1SoftwareRenderer">C++</LangRefLink> API.
### FemtoVG Renderer
@ -84,7 +85,7 @@ The Qt renderer comes with the <Link type="QtBackend" label="Qt backend" /> and
- Sophisticated GPU acceleration with OpenGL, Metal, Vulkan, and Direct3D.
- Heavy disk-footprint compared to other renderers.
- Available in the <Link type="WinitBackend" label="Winit backend" /> and <Link type="LinuxkmsBackend" label="LinuxKMS backend" />.
- Public [C++](https://slint.dev/docs/cpp/api/classslint_1_1platform_1_1SkiaRenderer) API.
- Public <LangRefLink lang="cpp" relpath="api/classslint_1_1platform_1_1SkiaRenderer">C++</LangRefLink> API.
#### Troubleshooting

View file

@ -6,6 +6,7 @@ description: Translations
---
import { Tabs, TabItem, FileTree } from '@astrojs/starlight/components';
import LangRefLink from '/src/components/LangRefLink.astro';
Slint's translation infrastructure makes your application available in different languages.
@ -207,7 +208,7 @@ Slint looks for `my_application.mo` in the `lang/fr/LC_MESSAGES/` directory.
First, enable the `gettext` feature of the `slint` crate in the `features` section to gain access to the translations API
and activate run-time translation support.
Next, use the [`slint::init_translations!`](https://slint.dev/docs/rust/slint/macro.init_translations) macro to specify the base location of your `.mo` files.
Next, use the <LangRefLink lang="rust-slint" relpath="macro.init_translations">`slint::init_translations!`</LangRefLink> macro to specify the base location of your `.mo` files.
This is the `dir_name` in the scheme of the previous section. Slint expects the `.mo` files to be in the
corresponding sub-directories and their file name - `domain_name` - must match the package name
in your `Cargo.toml`. This is often the same as the crate name.
@ -244,7 +245,7 @@ path/<lang>/LC_MESSAGES/<domain>.po
### Bundling
<Tabs syncKey="dev-language">
<TabItem label="C++" icon="cpp">
Set the [`SLINT_BUNDLE_TRANSLATIONS`](https://slint.dev/docs/cpp/cmake_reference.html#bundle-translations) property in CMake:
Set the <LangRefLink lang="cpp" relpath="cmake_reference.html#bundle-translations">`SLINT_BUNDLE_TRANSLATIONS`</LangRefLink> property in CMake:
```cmake
set_property(TARGET my_application PROPERTY SLINT_BUNDLE_TRANSLATIONS "${CMAKE_CURRENT_SOURCE_DIR}/lang")
@ -255,7 +256,7 @@ the `<domain>` is the cmake target name.
</TabItem>
<TabItem label="Rust" icon="rust">
Use `slint_build::CompilerConfiguration`'s [`with_bundled_translations()`](https://slint.dev/docs/rust/slint_build/struct.compilerconfiguration#method.with_bundled_translations) function to set up bundling in
Use `slint_build::CompilerConfiguration`'s <LangRefLink lang="rust-slint-build" relpath="struct.compilerconfiguration#method.with_bundled_translations">`with_bundled_translations()`</LangRefLink> function to set up bundling in
`build.rs`:
```rust
@ -276,10 +277,10 @@ if one of the bundled language matches the selected locale, it will be used.
<Tabs syncKey="dev-language">
<TabItem label="C++" icon="cpp">
Use the [`slint::select_bundled_translation`](https://slint.dev/docs/cpp/api/function_namespaceslint_1a18aba736373254f5be3362941f3ddbcd.html#_CPPv4N5slint26select_bundled_translationENSt11string_viewE) function to change translations at runtime.
Use the <LangRefLink lang="cpp" relpath="api/function_namespaceslint_1a18aba736373254f5be3362941f3ddbcd.html#_CPPv4N5slint26select_bundled_translationENSt11string_viewE">`slint::select_bundled_translation`</LangRefLink> function to change translations at runtime.
</TabItem>
<TabItem label="Rust" icon="rust">
Use the [`slint::select_bundled_translation`](https://slint.dev/docs/rust/slint/fn.select_bundled_translation.html) function to change translations at runtime.
Use the <LangRefLink lang="rust-slint" relpath="fn.select_bundled_translation.html">`slint::select_bundled_translation`</LangRefLink> function to change translations at runtime.
</TabItem>
</Tabs>

View file

@ -7,6 +7,7 @@ description: The `.slint` File
import CodeSnippetMD from '/src/components/CodeSnippetMD.astro';
import Link from '/src/components/Link.astro';
import LangRefLink from '/src/components/LangRefLink.astro';
You write user interfaces in the Slint language and saved in files with the `.slint` extension.
@ -338,9 +339,9 @@ The path to each library, as file or directory, must be defined separately at co
Use one of the following methods to help the Slint compiler resolve libraries to the correct
path on disk:
* When using Rust and `build.rs`, call [`with_library_paths`](https://slint.dev/docs/rust/slint_build/struct.CompilerConfiguration#method.with_library_paths)
* When using Rust and `build.rs`, call <LangRefLink lang="rust-slint-build" relpath="struct.CompilerConfiguration#method.with_library_paths">`with_library_paths`</LangRefLink>
to provide a mapping from library name to path.
* When using C++, use `LIBRARY_PATHS` with [`slint_target_sources`](https://slint.dev/docs/cpp/cmake_reference#slint-target-sources).
* When using C++, use `LIBRARY_PATHS` with <LangRefLink lang="cpp" relpath="cmake_reference#slint-target-sources">`slint_target_sources`</LangRefLink>.
* When invoking the `slint-viewer` from the command line, pass `-Lmylibrary=/path/to/my/library` for each component
library.
* When using the VS Code extension, configure the Slint extension's library path

View file

@ -4,13 +4,15 @@ title: Mobile
description: Mobile Platforms on which Slint has been tested
---
import LangRefLink from '/src/components/LangRefLink.astro';
The platform descriptions below cover what has been tested for deployment. For the development environment,
we recommend using a recent desktop operating system and compiler version.
## Android
Slint on Android is only supported for the Rust programming language.
See the documentation of the [android module in our Rust API documentation](https://slint.dev/docs/rust/slint/android/).
See the documentation of the <LangRefLink lang="rust-slint" relpath="android/">android module in our Rust API documentation</LangRefLink>.
## iOS

View file

@ -6,17 +6,18 @@ description: Connect the UI with business logic in your preferred language.
import { Card, CardGrid, LinkButton } from "@astrojs/starlight/components";
import IconLinkCard from "/src/components/IconLinkCard.astro";
import { CPP_BASE_URL, RUST_SLINT_CRATE_URL, NODEJS_BASE_URL } from "../../../utils/site-config";
Slint provides first class integrations to various programming languages allowing you to implement the business logic of your Slint application in your preferred language.
<CardGrid>
<IconLinkCard title="C++" href="https://docs.slint.dev/latest/docs/cpp/" icon="seti:cpp">
<IconLinkCard title="C++" href={CPP_BASE_URL} icon="seti:cpp">
Browse C++ API docs
</IconLinkCard>
<IconLinkCard title="Rust" href="https://docs.slint.dev/latest/docs/rust/slint/" icon="seti:rust">
<IconLinkCard title="Rust" href={RUST_SLINT_CRATE_URL} icon="seti:rust">
Browse Rust API docs
</IconLinkCard>
<IconLinkCard title="TypeScript (beta)" href="https://docs.slint.dev/latest/docs/node/" icon="seti:typescript">
<IconLinkCard title="TypeScript (beta)" href={NODEJS_BASE_URL} icon="seti:typescript">
Browse TypeScript / JavaScript API docs.
</IconLinkCard>
</CardGrid>

View file

@ -8,6 +8,7 @@ description: All Slint types
import SlintProperty from '/src/components/SlintProperty.astro';
import Link from '/src/components/Link.astro';
import { Tabs, TabItem } from '@astrojs/starlight/components';
import LangRefLink from '/src/components/LangRefLink.astro';
Slint is a statically typed language and offers a rich range of primitive types.
@ -150,16 +151,16 @@ AVIF, BMP, DDS, Farbfeld, GIF, HDR, ICO, JPEG, EXR, PNG, PNM, QOI, TGA, TIFF, We
<Tabs syncKey="dev-language">
<TabItem label="C++">
In C++, properties or struct fields of the image type are mapped to [`slint::Image`](https://docs.slint.dev/latest/docs/cpp/api/structslint_1_1Image).
In C++, properties or struct fields of the image type are mapped to <LangRefLink lang="cpp" relpath="api/structslint_1_1Image">`slint::Image`</LangRefLink>.
</TabItem>
<TabItem label="Rust">
In Rust, properties or struct fields of the image type are mapped to [`slint::Image`](https://docs.slint.dev/latest/docs/rust/slint/struct.Image).
In Rust, properties or struct fields of the image type are mapped to <LangRefLink lang="rust-slint" relpath="struct.Image">`slint::Image`</LangRefLink>.
:::note[Note]
Some image formats can be disabled using cargo features to reduce binary size and speed up compilation.
:::
</TabItem>
<TabItem label="NodeJS" >
In JavaScript properties or struct fields of the image type are mapped an object that implement the [ImageData interface](https://docs.slint.dev/latest/docs/node/interfaces/ImageData).
In JavaScript properties or struct fields of the image type are mapped an object that implement the <LangRefLink lang="nodejs" relpath="interfaces/ImageData.html">ImageData interface</LangRefLink>.
</TabItem>
</Tabs>

View file

@ -13,5 +13,3 @@ We recommend the following links to continue:
- [Examples](https://github.com/slint-ui/slint/tree/master/examples): The Slint repository has several demos and examples. These are a great starting point to learn how to use many Slint features.
- [Todo Example](https://github.com/slint-ui/slint/tree/master/examples/todo): This is one of the examples that implements a classic use-case.
- [Memory Puzzle](https://github.com/slint-ui/slint/tree/master/examples/memory): This is a slightly more polished version of the code in this example and you can <a href="https://slint.dev/demos/memory/" target="_blank">play the wasm version</a> in your browser.
- [Slint API Docs](https://slint.dev/docs/rust/slint/): The reference documentation for the main Rust crate.
- [Slint Interpreter API Docs](https://slint.dev/docs/rust/slint_interpreter/): The reference documentation for the Rust crate that allows you to dynamically load Slint files.

View file

@ -7,6 +7,7 @@ description: Creating the tiles
import { Code } from '@astrojs/starlight/components';
import { extractLines } from '/src/utils/utils.ts';
import { Tabs, TabItem } from '@astrojs/starlight/components';
import LangRefLink from '/src/components/LangRefLink.astro';
This step places the game tiles randomly.
@ -22,10 +23,10 @@ import mainTilesFromCpp from '/src/content/code/main_tiles_from_cpp.cpp?raw'
The code takes the list of tiles, duplicates it, and shuffles it, accessing the `memory_tiles` property through the C++ code.
For each top-level property, Slint generates a getter and a setter function. In this case `get_memory_tiles` and `set_memory_tiles`.
Since `memory_tiles` is a Slint array, it's represented as a [`std::shared_ptr<slint::Model>`](https://slint.dev/docs/cpp/api/classslint_1_1model).
Since `memory_tiles` is a Slint array, it's represented as a <LangRefLink lang="cpp" relpath="api/classslint_1_1model">`std::shared_ptr<slint::Model>`</LangRefLink>.
You can't change the model generated by Slint, but you can extract the tiles from it and put them
in a [`slint::VectorModel`](https://slint.dev/docs/cpp/api/classslint_1_1vectormodel) which inherits from `Model`.
in a <LangRefLink lang="cpp" relpath="api/classslint_1_1vectormodel">`slint::VectorModel`</LangRefLink> which inherits from `Model`.
`VectorModel` lets you make changes and you can use it to replace the static generated model.
</TabItem>
<TabItem label="NodeJS">
@ -38,9 +39,9 @@ import mainTilesFromJs from '/src/content/code/main_tiles_from_js.js?raw'
The code takes the list of tiles, duplicates it, and shuffles it, accessing the `memory_tiles` property through the JavaScript code.
As `memory_tiles` is an array, it's represented as a JavaScript [`Array`](https://slint.dev/docs/node/).
As `memory_tiles` is an array, it's represented as a JavaScript `Array`.
You can't change the model generated by Slint, but you can extract the tiles from it and put them
in a [`slint.ArrayModel`](https://slint.dev/docs/node/classes/arraymodel.html) which implements the [`Model`](https://slint.dev/docs/node/interfaces/model.html) interface.
in a <LangRefLink lang="nodejs" relpath="classes/ArrayModel">`slint.ArrayModel.html`</LangRefLink> which implements the <LangRefLink lang="nodejs" relpath="classes/Model.html">`Model`</LangRefLink> interface.
`ArrayModel` allows you to make changes and you can use it to replace the static generated model.
</TabItem>
<TabItem label="Rust">
@ -64,10 +65,10 @@ The code takes the list of tiles, duplicates it, and shuffles it, accessing the
For each top-level property,
Slint generates a getter and a setter function. In this case `get_memory_tiles` and `set_memory_tiles`.
Since `memory_tiles` is a Slint array represented as a [`Rc<dyn slint::Model>`](https://slint.dev/docs/rust/slint/trait.Model).
Since `memory_tiles` is a Slint array represented as a <LangRefLink lang="rust-slint" relpath="trait.Model">`Rc<dyn slint::Model>`</LangRefLink>.
You can't change the model generated by Slint, but you can extract the tiles from it and put them
in a [`VecModel`](https://slint.dev/docs/rust/slint/struct.VecModel) which implements the `Model` trait.
in a <LangRefLink lang="rust-slint" relpath="struct.VecModel">`VecModel`</LangRefLink> which implements the `Model` trait.
`VecModel` lets you make changes and you can use it to replace the static generated model.

View file

@ -7,6 +7,8 @@ description: Game Logic
import { Tabs, TabItem } from '@astrojs/starlight/components';
import { extractLines } from '/src/utils/utils.ts';
import { Code } from '@astrojs/starlight/components';
import LangRefLink from '/src/components/LangRefLink.astro';
This step implements the rules of the game in your coding language of choice.
@ -49,7 +51,7 @@ import gameLogicInCpp from '/src/content/code/main_game_logic.cpp?raw'
<Code code={extractLines(gameLogicInCpp, 29, 65)} lang="cpp" />
The code uses a [ComponentWeakHandle](https://slint.dev/docs/cpp/api/classslint_1_1ComponentWeakHandle) pointer of the `main_window`. This is
The code uses a <LangRefLink lang="cpp" relpath="api/classslint_1_1ComponentWeakHandle">`ComponentWeakHandle`</LangRefLink> pointer of the `main_window`. This is
important because capturing a copy of the `main_window` itself within the callback handler would result in circular ownership.
The `MainWindow` owns the callback handler, which itself owns a reference to the `MainWindow`, which must be weak
instead of strong to avoid a memory leak.
@ -107,7 +109,7 @@ Add this code before the `main_window.run().unwrap();` call:
<Code code={extractLines(gameLogicInRust, 25, 52)} lang="rust" />
The code uses a [Weak](https://slint.dev/docs/rust/slint/struct.Weak) pointer of the `main_window`. This is
The code uses a <LangRefLink lang="rust-slint" relpath="struct.Weak">Weak</LangRefLink> pointer of the `main_window`. This is
important because capturing a copy of the `main_window` itself within the callback handler would result in circular ownership.
The `MainWindow` owns the callback handler, which itself owns a reference to the `MainWindow`, which must be weak
instead of strong to avoid a memory leak.

View file

@ -4,3 +4,9 @@
export const BASE_URL = "https://localhost";
export const BASE_PATH = "/docs/";
export const SLINT_DOWNLOAD_VERSION = "nightly";
export const CPP_BASE_URL = `${BASE_URL}${BASE_PATH}../cpp/`;
export const RUST_BASE_URL = `${BASE_URL}${BASE_PATH}../rust/`;
export const RUST_SLINT_CRATE_URL = `${RUST_BASE_URL}slint/`;
export const RUST_SLINT_INTERPRETER_CRATE_URL = `${RUST_BASE_URL}slint_interpreter/`;
export const RUST_SLINT_BUILD_CRATE_URL = `${RUST_BASE_URL}slint_build/`;
export const NODEJS_BASE_URL = `${BASE_URL}${BASE_PATH}../nodejs/`;