""
] [Root,"count: 0"
] @@ -229,7 +229,7 @@ Like most GUIs, Dioxus relies on an event loop to progress the VirtualDOM. The V The code for the WebSys implementation is straightforward, so we'll add it here to demonstrate how simple an event loop is: -```rust, ignore +```rust, no_run, ignore pub async fn run(&mut self) -> dioxus_core::error::Result<()> { // Push the body element onto the WebsysDom's stack machine let mut websys_dom = crate::new::WebsysDom::new(prepare_websys_dom()); @@ -259,7 +259,7 @@ pub async fn run(&mut self) -> dioxus_core::error::Result<()> { It's important to decode what the real events are for your event system into Dioxus' synthetic event system (synthetic meaning abstracted). This simply means matching your event type and creating a Dioxus `UserEvent` type. Right now, the virtual event system is modeled almost entirely around the HTML spec, but we are interested in slimming it down. -```rust, ignore +```rust, no_run, ignore fn virtual_event_from_websys_event(event: &web_sys::Event) -> VirtualEvent { match event.type_().as_str() { "keydown" => { @@ -308,7 +308,7 @@ The `RealDom` is a higher-level abstraction over updating the Dom. It uses an en Let's build a toy renderer with borders, size, and text color. Before we start let's take a look at an example element we can render: -```rust +```rust, no_run cx.render(rsx!{ div{ color: "red", @@ -380,19 +380,19 @@ To help in building a Dom, native-core provides the State trait and a RealDom st Native Core cannot create all of the required methods for the State trait, but it can derive some of them. To implement the State trait, you must implement the following methods and let the `#[partial_derive_state]` macro handle the rest: -```rust, ignore +```rust, no_run, ignore {{#include ../../../examples/custom_renderer.rs:derive_state}} ``` Lets take a look at how to implement the State trait for a simple renderer. -```rust +```rust, no_run {{#include ../../../examples/custom_renderer.rs:state_impl}} ``` Now that we have our state, we can put it to use in our RealDom. We can update the RealDom with apply_mutations to update the structure of the dom (adding, removing, and changing properties of nodes) and then update_state to update the States for each of the nodes that changed. -```rust +```rust, no_run {{#include ../../../examples/custom_renderer.rs:rendering}} ``` @@ -404,7 +404,7 @@ For most platforms, the layout of the Elements will stay the same. The [layout_a To make it easier to implement text editing in rust renderers, `native-core` also contains a renderer-agnostic cursor system. The cursor can handle text editing, selection, and movement with common keyboard shortcuts integrated. -```rust +```rust, no_run {{#include ../../../examples/custom_renderer.rs:cursor}} ``` diff --git a/docs/guide/src/en/describing_ui/component_children.md b/docs/guide/src/en/describing_ui/component_children.md index 02be25cd5..7e329abbc 100644 --- a/docs/guide/src/en/describing_ui/component_children.md +++ b/docs/guide/src/en/describing_ui/component_children.md @@ -2,13 +2,13 @@ In some cases, you may wish to create a component that acts as a container for some other content, without the component needing to know what that content is. To achieve this, create a prop of type `Element`: -```rust +```rust, no_run {{#include ../../../examples/component_element_props.rs:Clickable}} ``` Then, when rendering the component, you can pass in the output of `cx.render(rsx!(...))`: -```rust +```rust, no_run {{#include ../../../examples/component_element_props.rs:Clickable_usage}} ``` @@ -20,12 +20,12 @@ Then, when rendering the component, you can pass in the output of `cx.render(rsx Rather than passing the RSX through a regular prop, you may wish to accept children similarly to how elements can have children. The "magic" `children` prop lets you achieve this: -```rust +```rust, no_run {{#include ../../../examples/component_children.rs:Clickable}} ``` This makes using the component much simpler: simply put the RSX inside the `{}` brackets – and there is no need for a `render` call or another macro! -```rust +```rust, no_run {{#include ../../../examples/component_children.rs:Clickable_usage}} ``` diff --git a/docs/guide/src/en/describing_ui/component_props.md b/docs/guide/src/en/describing_ui/component_props.md index 9c5cd4be3..947ec5f70 100644 --- a/docs/guide/src/en/describing_ui/component_props.md +++ b/docs/guide/src/en/describing_ui/component_props.md @@ -7,6 +7,7 @@ Just like you can pass arguments to a function, you can pass props to a componen Component props are a single struct annotated with `#[derive(Props)]`. For a component to accept props, the type of its argument must be `Scope-
-
- First Item -
- Second Item -
- Third Item +
- First Item +
- Second Item +
- Third Item
📦✨ Dioxus CLI
+Tooling to supercharge Dioxus projects
++ +It will be cloned from the [dioxus-template](https://github.com/DioxusLabs/dioxus-template) repository. + +
+ +Alternatively, you can specify the template path: + +``` +dioxus create hello --template gh:dioxuslabs/dioxus-template +``` + +## Dioxus Config File + +Dioxus CLI will use `Dioxus.toml` file to Identify some project info and switch some cli feature. + +You can get more configure information from [Dioxus CLI Document](https://dioxuslabs.com/cli/configure.html). diff --git a/packages/cli/build.rs b/packages/cli/build.rs new file mode 100644 index 000000000..15935e2da --- /dev/null +++ b/packages/cli/build.rs @@ -0,0 +1,50 @@ +//! Construct version in the `commit-hash date channel` format + +use std::{env, path::PathBuf, process::Command}; + +fn main() { + set_rerun(); + set_commit_info(); + if option_env!("CFG_RELEASE").is_none() { + println!("cargo:rustc-env=POKE_RA_DEVS=1"); + } +} + +fn set_rerun() { + println!("cargo:rerun-if-env-changed=CFG_RELEASE"); + + let mut manifest_dir = PathBuf::from( + env::var("CARGO_MANIFEST_DIR").expect("`CARGO_MANIFEST_DIR` is always set by cargo."), + ); + + while manifest_dir.parent().is_some() { + let head_ref = manifest_dir.join(".git/HEAD"); + if head_ref.exists() { + println!("cargo:rerun-if-changed={}", head_ref.display()); + return; + } + + manifest_dir.pop(); + } + + println!("cargo:warning=Could not find `.git/HEAD` from manifest dir!"); +} + +fn set_commit_info() { + let output = match Command::new("git") + .arg("log") + .arg("-1") + .arg("--date=short") + .arg("--format=%H %h %cd") + .output() + { + Ok(output) if output.status.success() => output, + _ => return, + }; + let stdout = String::from_utf8(output.stdout).unwrap(); + let mut parts = stdout.split_whitespace(); + let mut next = || parts.next().unwrap(); + println!("cargo:rustc-env=RA_COMMIT_HASH={}", next()); + println!("cargo:rustc-env=RA_COMMIT_SHORT_HASH={}", next()); + println!("cargo:rustc-env=RA_COMMIT_DATE={}", next()) +} diff --git a/packages/cli/docs/.gitignore b/packages/cli/docs/.gitignore new file mode 100644 index 000000000..7585238ef --- /dev/null +++ b/packages/cli/docs/.gitignore @@ -0,0 +1 @@ +book diff --git a/packages/cli/docs/book.toml b/packages/cli/docs/book.toml new file mode 100644 index 000000000..c5c216fe4 --- /dev/null +++ b/packages/cli/docs/book.toml @@ -0,0 +1,6 @@ +[book] +authors = ["YuKun Liu"] +language = "en" +multilingual = false +src = "src" +title = "Dioxus Cli" diff --git a/packages/cli/docs/src/SUMMARY.md b/packages/cli/docs/src/SUMMARY.md new file mode 100644 index 000000000..b5e3b91ae --- /dev/null +++ b/packages/cli/docs/src/SUMMARY.md @@ -0,0 +1,18 @@ +# Summary + +- [Introduction](./introduction.md) +- [Installation](./installation.md) +- [Create a Project](./creating.md) +- [Configure Project](./configure.md) +- [Commands](./cmd/README.md) + - [Build](./cmd/build.md) + - [Serve](./cmd/serve.md) + - [Clean](./cmd/clean.md) + - [Translate](./cmd/translate.md) +- [Plugin Development](./plugin/README.md) + - [API.Log](./plugin/interface/log.md) + - [API.Command](./plugin/interface/command.md) + - [API.OS](./plugin/interface/os.md) + - [API.Directories](./plugin/interface/dirs.md) + - [API.Network](./plugin/interface/network.md) + - [API.Path](./plugin/interface/path.md) \ No newline at end of file diff --git a/packages/cli/docs/src/cmd/README.md b/packages/cli/docs/src/cmd/README.md new file mode 100644 index 000000000..dae226577 --- /dev/null +++ b/packages/cli/docs/src/cmd/README.md @@ -0,0 +1,26 @@ +# Commands + +In this chapter we will introduce all `dioxus-cli` commands. + +> You can also use `dioxus --help` to get cli help info. + +``` +dioxus +Build, bundle, & ship your Dioxus app + +USAGE: + dioxus [OPTIONS]