Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Docs: Apply usage of language tabs everywhere #7416

Merged
merged 2 commits into from
Jan 21, 2025
Merged

Docs: Apply usage of language tabs everywhere #7416

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8f4ee2d
Docs: Apply usage of language tabs everywhere
NigelBreslaw Jan 21, 2025
50349df
[autofix.ci] apply automated fixes
autofix-ci[bot] Jan 21, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 17 additions & 15 deletions docs/astro/src/content/docs/guide/development/custom-controls.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ title: Custom Controls
description: Custom Controls
---

import { Tabs, TabItem } from '@astrojs/starlight/components';

# Custom Control Introduction

Expand Down Expand Up @@ -76,8 +77,8 @@ In Slint, `-` and `_` are equivalent and interchangeable in all identifiers.
This is different in native code: Most programming languages forbid `-` in
identifiers, so `-` is replaced with `_`.

<details data-snippet-language="rust">
<summary>Rust code</summary>
<Tabs syncKey="dev-language">
<TabItem label="Rust">

For technical reasons, this example uses `export {Recipe}` in the `slint!` macro.
In real code, you can put the whole Slint code in the `slint!` macro, or use
Expand Down Expand Up @@ -113,10 +114,10 @@ can move into the callback.
We can't use a strong handle here, because that would form a cycle: The component
handle has ownership of the callback, which itself has ownership of the
closure's captured variables.
</details>

<details data-snippet-language="cpp">
<summary>C++ code</summary>
</TabItem>
<TabItem label="C++">

In C++ you can write

```cpp
Expand All @@ -143,7 +144,8 @@ for each accessible callback in `Recipe`. In this case we will have `get_counter
`set_counter` to access the `counter` property and `on_button_pressed` to
set up the callback.

</details>
</TabItem>
</Tabs>

## Use Property Bindings to Synchronize Controls

Expand Down Expand Up @@ -437,9 +439,9 @@ export component Recipe inherits Window {
}
}
```
<Tabs syncKey="dev-language">
<TabItem label="Rust">

<details data-snippet-language="rust">
<summary>Rust code</summary>
In Rust you can set the callback like this:

```rust
Expand Down Expand Up @@ -477,9 +479,8 @@ fn main() {
// ...
}
```
</details>

<details data-snippet-language="cpp">
</TabItem>
<TabItem label="C++">
<summary>C++ code</summary>
In C++ you can set the callback like this:

Expand All @@ -495,10 +496,10 @@ int main(int argc, char **argv)
// ...
}
```
</details>
</TabItem>
<TabItem label="NodeJS">


<details data-snippet-language="javascript">
<summary>JavaScript code</summary>
In JavaScript you can set the callback like this:

```js
Expand All @@ -510,7 +511,8 @@ recipe.Logic.to_upper_case = (str) => {
};
// ...
```
</details>
</TabItem>
</Tabs>

# Custom Widgets

Expand Down
23 changes: 9 additions & 14 deletions docs/astro/src/content/docs/guide/language/coding/globals.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ title: Globals
description: Globals
---
import Link from '/src/components/Link.astro';
import { Tabs, TabItem } from '@astrojs/starlight/components';

Declare a global singleton with `global Name { /* .. properties or callbacks .. */ }` to
make properties and callbacks available throughout the entire project. Access them using `Name.property`.
Expand Down Expand Up @@ -34,9 +35,8 @@ export global Logic {
}
// ...
```

<details data-snippet-language="rust">
<summary>Usage from Rust</summary>
<Tabs syncKey="dev-language">
<TabItem label="Rust">

```rust
slint::slint!{
Expand All @@ -61,10 +61,8 @@ fn main() {
}
```

</details>

<details data-snippet-language="cpp">
<summary>Usage from C++</summary>
</TabItem>
<TabItem label="C++">

```cpp
#include "app.h"
Expand All @@ -78,11 +76,8 @@ fn main() {
// ...
}
```

</details>

<details data-snippet-language="javascript">
<summary>Usage from JavaScript</summary>
</TabItem>
<TabItem label="NodeJS">

```js
let slint = require("slint-ui");
Expand All @@ -94,8 +89,8 @@ app.Logic.magic_operation = (value) => {
app.Logic.the_value = 42;
// ...
```

</details>
</TabItem>
</Tabs>

It's possible to re-expose a callback or properties from a global using the two way binding syntax.

Expand Down
2 changes: 1 addition & 1 deletion docs/astro/src/content/docs/reference/std-widgets/style.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ Define a `SLINT_STYLE` CMake cache variable to contain the style name as a strin
cmake -DSLINT_STYLE="material" /path/to/source
```
</TabItem>
<TabItem label="Node.js">
<TabItem label="NodeJS">

You can select the style by setting the `style` property in [`LoadFileOptions`](slint-node:interfaces/LoadFileOptions) passed to [`loadFile`](slint-node:functions/loadFile):

Expand Down
Loading