feat: inline dioxus-native from blitz (#3675)

* Rename dioxus-blitz to dioxus-native

* Add CSS import support (#139)

* Remove data dependencie from NetProvider + global provider.

* Feat CSS import

* Move net handler code out of util

* Fixing test...

* Use the better suited OnceLock instead of LazyLock

* Removing static and move resource callback back out of the document.

Signed-off-by: koko <kokos.kekse@gmail.com>

* Make things work

Signed-off-by: koko <kokos.kekse@gmail.com>

* Fix the servo example

Signed-off-by: koko <kokos.kekse@gmail.com>

* Replace servo image with a more compact version

Signed-off-by: koko <kokos.kekse@gmail.com>

* revert: 8467b271

Signed-off-by: koko <kokos.kekse@gmail.com>

---------

Signed-off-by: koko <kokos.kekse@gmail.com>

* Create readme app

* WPT: reuse FontContext to avoid reloading system fonts

Takes runtime for css-flexbox from 12s -> 8s

* Move Devtools to traits crate

* Suppress unused variable warning

* Implement net for DioxusDocument

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Eliminate BlitzWindowEvent type

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Make net crate use document id instead of window id

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Rename and document net traits

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Split `dioxus-native` crate into `dioxus-native` and `blitz-shell` crates (#163)

* Rename waker module to event

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Create seperate DioxusNativeApplication

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Rename dioxus-native crate to blitz-shell

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Split blitz-shell out of dioxus-native crate

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Remove need for dioxus-native to depend directly on stylo

---------

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Unnest dioxus-native modules

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Split MutationWriter into it's own module

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Split HtmlDocument into it's own crate

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Rename dom field of Window to doc

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Support prefers-color-scheme (dark mode)

* Remove use of the `todo` macro in event handling and add a comment about it being a todo (#168)

Using the `todo` macro causes a panic when this event is encountered. Noop is preferable in this case as it does not crash the application. This is especially annoying on platforms where `Ime::Enabled` event is sent upon application start even when the user is using a keyboard layout that does not need an IME support. There was added a "TODO" comment that informs about this feature being missing. Most IDEs and code editors have support/plugins/extensions to work with this type of comments and this type of comment is already used widely across the codebase. As such, the information about this feature not being implemented is not lost.

* Upgrade to dioxus 0.6-rc.0

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Fix text input in dioxus-native

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Make dioxus-native depend dioxus-core and dioxus-html rather than dioxus

* Remove "full" feature from tokio

* Move Viewport to blitz_traits

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Make tokio optional in dioxus-native and blitz-shell

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Make SVG support optional

* Abstract renderer behind a trait

blitz-shell no longer depends on blitz-renderer-vello

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Split HTML launch functions out in `blitz` crate

* feat: Add mousedown and mouseup event (#172)

* feat: Add mousedown and mouseup event

* feat: Triggering :active pseudo-class

* fix: Triggering :active pseudo-class

* Rename RendererEvent to DomEvent

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Rename Document to BaseDocument. DocumentLike to Document

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Move event and document abstractions to blitz-traits

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Rename BlitzEvent to BlitzShellEvent

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Restyle when style attribute is mutated

* feat: Support text box mouse selection (#182)

* Rename raw_dom_data to data

Signed-off-by: Nico Burns <nico@nicoburns.com>

* Rename dioxus-native to native

* Add to workspace

* simplify launch module, integrate native

* Fix it up again

* Update cargo lock

* FIx: propagate accessibility feature fla

* implement asset resolver

* add native to feature match in cli

* Implement document and history for native

* use no-op eval

* clippy

* typos

* typo

* Convert logs to trace

* Bump blitz to alpha releases

* unset image data

* fix style integration with blitz

* fix a few lints

* wire up ids

* implement a few more events

* add more helpful todo note

* bump ci to allow edition 2024, use newer nightly

* make clippy happy

* also update matrix tests to rust 2024

* Add autofocus

Co-authored-by: otgerrogla 2356820+otgerrogla@users.noreply.github.com

* Wait for the suspense boundary above the router to resolve before sending the first streaming chunk (#3891)

* Change the suspense streaming context after suspense is resolved in the router

* Wait for the suspense context before streaming the first chunk in ssr

* forward more response parts

* warn

* extract the hydration format into a crate

* Fix hydration when no data is sent

* forward web and server features

* Fix suspense that starts on the client

* fix use_server_future on the client

* Add documentation for fullstack hooks and protocol

* downgrade rust edition

* fix clippy

* fix tests

* fix clippy

* Fix pure web compile

* undo changes to the fullstack router example

* fix formatting

* hoist a bunch of deps

---------

Signed-off-by: koko <kokos.kekse@gmail.com>
Signed-off-by: Nico Burns <nico@nicoburns.com>
Co-authored-by: Nico Burns <nico@nicoburns.com>
Co-authored-by: koko <72217393+kokoISnoTarget@users.noreply.github.com>
Co-authored-by: David Husička <25853767+DavidHusicka@users.noreply.github.com>
Co-authored-by: luoxiaozero <48741584+luoxiaozero@users.noreply.github.com>
Co-authored-by: Evan Almloff <evanalmloff@gmail.com>
This commit is contained in:
Jonathan Kelleyotgerrogla 2356820+otgerrogla@users.noreply.github.comNico BurnskokoDavid HusičkaluoxiaozeroEvan Almloff
authored and GitHub committed 2025-04-08 17:30:49 -07:00
1 parent 84221f55a0
commit 12c6938346
35 files changed
+6128 -2059

No files matched your search

+13 -13
View File
@@ -39,7 +39,7 @@ env:
CARGO_TERM_COLOR: always
CARGO_INCREMENTAL: 0 # todo(jon): cargo-cache wipes incremental artifacts, but we eventually want to cache them
RUST_BACKTRACE: 1
rust_nightly: nightly-2024-10-20
rust_nightly: nightly-2025-04-07
jobs:
check-msrv:
@@ -48,7 +48,7 @@ jobs:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: dtolnay/rust-toolchain@1.84.0
- uses: dtolnay/rust-toolchain@1.86.0
- uses: Swatinem/rust-cache@v2
with:
cache-all-crates: "true"
@@ -73,7 +73,7 @@ jobs:
with:
packages: libwebkit2gtk-4.1-dev libgtk-3-dev libayatana-appindicator3-dev libxdo-dev
version: 1.0
- uses: dtolnay/rust-toolchain@1.84.0
- uses: dtolnay/rust-toolchain@1.86.0
with:
components: rustfmt, clippy
- uses: Swatinem/rust-cache@v2
@@ -92,7 +92,7 @@ jobs:
with:
packages: libwebkit2gtk-4.1-dev libgtk-3-dev libayatana-appindicator3-dev libxdo-dev
version: 1.0
- uses: dtolnay/rust-toolchain@1.84.0
- uses: dtolnay/rust-toolchain@1.86.0
with:
components: rustfmt, clippy
- uses: Swatinem/rust-cache@v2
@@ -107,7 +107,7 @@ jobs:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: dtolnay/rust-toolchain@1.84.0
- uses: dtolnay/rust-toolchain@1.86.0
with:
components: rustfmt
- uses: Swatinem/rust-cache@v2
@@ -152,7 +152,7 @@ jobs:
with:
packages: libwebkit2gtk-4.1-dev libgtk-3-dev libayatana-appindicator3-dev libxdo-dev
version: 1.0
- uses: dtolnay/rust-toolchain@1.84.0
- uses: dtolnay/rust-toolchain@1.86.0
- uses: Swatinem/rust-cache@v2
with:
cache-all-crates: "true"
@@ -168,7 +168,7 @@ jobs:
with:
packages: libwebkit2gtk-4.1-dev libgtk-3-dev libayatana-appindicator3-dev libxdo-dev
version: 1.0
- uses: dtolnay/rust-toolchain@1.84.0
- uses: dtolnay/rust-toolchain@1.86.0
with:
components: rustfmt, clippy
- uses: Swatinem/rust-cache@v2
@@ -237,7 +237,7 @@ jobs:
- {
target: aarch64-apple-darwin,
os: macos-latest,
toolchain: "1.84.0",
toolchain: "1.86.0",
cross: false,
command: "test",
args: "--all --tests",
@@ -245,7 +245,7 @@ jobs:
- {
target: x86_64-apple-darwin,
os: macos-13,
toolchain: "1.84.0",
toolchain: "1.86.0",
cross: false,
command: "test",
args: "--all --tests",
@@ -253,7 +253,7 @@ jobs:
- {
target: aarch64-apple-ios,
os: macos-latest,
toolchain: "1.84.0",
toolchain: "1.86.0",
cross: false,
command: "build",
args: "--package dioxus-mobile",
@@ -261,7 +261,7 @@ jobs:
- {
target: aarch64-linux-android,
os: ubuntu-latest,
toolchain: "1.84.0",
toolchain: "1.86.0",
cross: true,
command: "build",
args: "--package dioxus-mobile",
@@ -302,7 +302,7 @@ jobs:
name: "cargo test | windows"
steps:
- uses: actions/checkout@v4
- uses: dtolnay/rust-toolchain@1.84.0
- uses: dtolnay/rust-toolchain@1.86.0
with:
components: rustfmt, clippy
- uses: Swatinem/rust-cache@v2
@@ -335,7 +335,7 @@ jobs:
# runs-on: ubuntu-latest
# steps:
# - uses: actions/checkout@v4
# - uses: dtolnay/rust-toolchain@1.84.0
# - uses: dtolnay/rust-toolchain@1.86.0
# - uses: Swatinem/rust-cache@v2
# with:
# cache-all-crates: "true"
Generated
+3181 -1729
View File
File diff suppressed because it is too large. Load diff
+17
View File
@@ -68,6 +68,15 @@ members = [
"packages/dx-wire-format",
"packages/logger",
"packages/config-macros",
"packages/native",
"packages/asset-resolver",
# Playwright tests
"packages/playwright-tests/liveview",
"packages/playwright-tests/web",
"packages/playwright-tests/fullstack",
"packages/playwright-tests/suspense-carousel",
"packages/playwright-tests/nested-suspense",
# manganis
"packages/manganis/manganis",
@@ -150,6 +159,8 @@ dioxus-fullstack-protocol = { path = "packages/fullstack-protocol", version = "0
dioxus_server_macro = { path = "packages/server-macro", version = "0.6.2", default-features = false }
dioxus-dx-wire-format = { path = "packages/dx-wire-format", version = "0.6.2" }
dioxus-logger = { path = "packages/logger", version = "0.6.2" }
dioxus-native = { path = "packages/native", version = "0.6.2" }
dioxus-asset-resolver = { path = "packages/asset-resolver", version = "0.6.2" }
dioxus-config-macros = { path = "packages/config-macros", version = "0.6.3" }
const-serialize = { path = "packages/const-serialize", version = "0.6.2" }
const-serialize-macro = { path = "packages/const-serialize-macro", version = "0.6.2" }
@@ -253,6 +264,8 @@ rayon = "1.2.0"
wasmparser = "0.225.0"
itertools = "0.14.0"
macro-string = "0.1.3"
walkdir = "2.5.0"
url = "2.3.1"
# desktop
wry = { version = "0.50.1", default-features = false }
@@ -270,6 +283,10 @@ objc = { version = "0.2.7", features = ["exception"] }
objc_id = "0.1.1"
tray-icon = "0.19"
# native
keyboard-types = "0.7"
winit = { version = "0.30.2", features = ["rwh_06"] }
# disable debug symbols in dev builds - shouldn't matter for downstream crates but makes our binaries (examples, cli, etc) build faster
[profile.dev]
debug = 0
+1 -1
View File
@@ -36,7 +36,7 @@ fn app() -> Element {
main {
for (dir_id, path) in files.read().path_names.iter().enumerate() {
{
let path_end = path.components().last().map(|p|p.as_os_str()).unwrap_or(path.as_os_str()).to_string_lossy();
let path_end = path.components().next_back().map(|p|p.as_os_str()).unwrap_or(path.as_os_str()).to_string_lossy();
let path = path.display();
rsx! {
div { class: "folder", key: "{path}",
+379
View File
@@ -0,0 +1,379 @@
html,
body, pre {
margin: 0;
padding: 0;
}
button {
margin: 0;
padding: 0;
border: 0;
background: none;
font-size: 100%;
vertical-align: baseline;
font-family: inherit;
font-weight: inherit;
color: inherit;
-webkit-appearance: none;
appearance: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
font: 14px 'Helvetica Neue', Helvetica, Arial, sans-serif;
line-height: 1.4em;
background: #f5f5f5;
color: #4d4d4d;
min-width: 230px;
max-width: 550px;
margin: 0 auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-weight: 300;
}
:focus {
outline: 0;
}
.hidden {
display: none;
}
.todoapp {
background: #fff;
margin: 130px 0 40px 0;
position: relative;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 25px 50px 0 rgba(0, 0, 0, 0.1);
}
.todoapp input::-webkit-input-placeholder {
font-style: italic;
font-weight: 300;
color: #e6e6e6;
}
.todoapp input::-moz-placeholder {
font-style: italic;
font-weight: 300;
color: #e6e6e6;
}
.todoapp input::input-placeholder {
font-style: italic;
font-weight: 300;
color: #e6e6e6;
}
.todoapp h1 {
position: absolute;
top: -155px;
width: 100%;
font-size: 100px;
font-weight: 100;
text-align: center;
color: rgba(175, 47, 47, 1.0);
-webkit-text-rendering: optimizeLegibility;
-moz-text-rendering: optimizeLegibility;
text-rendering: optimizeLegibility;
}
.new-todo,
.edit {
position: relative;
margin: 0;
width: 100%;
font-size: 24px;
font-family: inherit;
font-weight: inherit;
line-height: 1.4em;
border: 0;
color: inherit;
padding: 6px;
border: 1px solid #999;
box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.new-todo {
padding: 16px 16px 16px 60px;
border: none;
background: rgba(0, 0, 0, 0.003);
box-shadow: inset 0 -2px 1px rgba(0, 0, 0, 0.03);
}
.main {
position: relative;
z-index: 2;
border-top: 1px solid #e6e6e6;
}
.toggle-all {
text-align: center;
border: none;
/* Mobile Safari */
opacity: 0;
position: absolute;
}
.toggle-all+label {
width: 60px;
height: 34px;
font-size: 0;
position: absolute;
top: -52px;
left: -13px;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.toggle-all+label:before {
content: '❯';
font-size: 22px;
color: #e6e6e6;
padding: 10px 27px 10px 27px;
}
.toggle-all:checked+label:before {
color: #737373;
}
.todo-list {
margin: 0;
padding: 0;
list-style: none;
}
.todo-list li {
position: relative;
font-size: 24px;
border-bottom: 1px solid #ededed;
}
.todo-list li:last-child {
border-bottom: none;
}
.todo-list li.editing {
border-bottom: none;
padding: 0;
}
.todo-list li.editing .edit {
display: block;
width: 506px;
padding: 12px 16px;
margin: 0 0 0 43px;
}
.todo-list li.editing .view {
display: none;
}
.todo-list li .toggle {
text-align: center;
width: 40px;
/* auto, since non-WebKit browsers doesn't support input styling */
height: auto;
position: absolute;
top: 0;
bottom: 0;
margin: auto 0;
border: none;
/* Mobile Safari */
-webkit-appearance: none;
appearance: none;
}
.todo-list li .toggle {
opacity: 0;
}
.todo-list li .toggle+label {
/*
Firefox requires `#` to be escaped - https://bugzilla.mozilla.org/show_bug.cgi?id=922433
IE and Edge requires *everything* to be escaped to render, so we do that instead of just the `#` - https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7157459/
*/
background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%22-10%20-18%20100%20135%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%23ededed%22%20stroke-width%3D%223%22/%3E%3C/svg%3E');
background-repeat: no-repeat;
background-position: center left;
}
.todo-list li .toggle:checked+label {
background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%22-10%20-18%20100%20135%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%23bddad5%22%20stroke-width%3D%223%22/%3E%3Cpath%20fill%3D%22%235dc2af%22%20d%3D%22M72%2025L42%2071%2027%2056l-4%204%2020%2020%2034-52z%22/%3E%3C/svg%3E');
}
.todo-list li label {
word-break: break-all;
padding: 15px 15px 15px 60px;
display: block;
line-height: 1.2;
transition: color 0.4s;
}
.todo-list li.completed label {
color: #d9d9d9;
text-decoration: line-through;
}
.todo-list li .destroy {
display: none;
position: absolute;
top: 0;
right: 10px;
bottom: 0;
width: 40px;
height: 40px;
margin: auto 0;
font-size: 30px;
color: #cc9a9a;
margin-bottom: 11px;
transition: color 0.2s ease-out;
}
.todo-list li .destroy:hover {
color: #af5b5e;
}
.todo-list li .destroy:after {
content: '×';
}
.todo-list li:hover .destroy {
display: block;
}
.todo-list li .edit {
display: none;
}
.todo-list li.editing:last-child {
margin-bottom: -1px;
}
.footer {
color: #777;
padding: 10px 15px;
height: 20px;
text-align: center;
border-top: 1px solid #e6e6e6;
display: flex;
justify-content: space-between;
align-items: center;
}
.footer:before {
content: '';
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 50px;
overflow: hidden;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 8px 0 -3px #f6f6f6, 0 9px 1px -3px rgba(0, 0, 0, 0.2), 0 16px 0 -6px #f6f6f6, 0 17px 2px -6px rgba(0, 0, 0, 0.2);
}
.todo-count {
float: left;
text-align: left;
white-space-collapse: preserve;
}
.todo-count strong {
font-weight: 300;
}
.filters {
margin: 0;
padding: 0;
list-style: none;
position: absolute;
right: 0;
left: 0;
}
.filters li {
display: inline-block;
}
.filters li a {
display: inline-block;
color: inherit;
margin: 3px;
padding: 3px 7px;
text-decoration: none;
border: 1px solid transparent;
border-radius: 3px;
}
.filters li a:hover {
border-color: rgba(175, 47, 47, 0.1);
}
.filters li a.selected {
border-color: rgba(175, 47, 47, 0.2);
}
.clear-completed,
html .clear-completed:active {
float: right;
position: relative;
line-height: 20px;
text-decoration: none;
cursor: pointer;
display: inline-block;
}
.clear-completed:hover {
text-decoration: underline;
}
.info {
margin: 65px auto 0;
color: #bfbfbf;
font-size: 10px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
text-align: center;
}
.info p {
line-height: 1;
}
.info a {
color: inherit;
text-decoration: none;
font-weight: 400;
}
.info a:hover {
text-decoration: underline;
}
/*
Hack to remove background from Mobile Safari.
Can't use it globally since it destroys checkboxes in Firefox
*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
.toggle-all,
.todo-list li .toggle {
background: none;
}
.todo-list li .toggle {
height: 40px;
}
}
@media (max-width: 430px) {
.footer {
height: 50px;
}
.filters {
bottom: 10px;
}
}
+269
View File
@@ -0,0 +1,269 @@
//! The typical TodoMVC app, implemented in Dioxus.
use dioxus::prelude::*;
use std::collections::HashMap;
const STYLE: Asset = asset!("/examples/assets/todomvc-native.css");
fn main() {
dioxus::launch(app);
}
#[derive(PartialEq, Eq, Clone, Copy)]
enum FilterState {
All,
Active,
Completed,
}
#[derive(Debug, PartialEq, Eq)]
struct TodoItem {
id: u32,
checked: bool,
contents: String,
}
fn app() -> Element {
// We store the todos in a HashMap in a Signal.
// Each key is the id of the todo, and the value is the todo itself.
let mut todos = use_signal(HashMap::<u32, TodoItem>::new);
let filter = use_signal(|| FilterState::All);
// We use a simple memoized signal to calculate the number of active todos.
// Whenever the todos change, the active_todo_count will be recalculated.
let active_todo_count =
use_memo(move || todos.read().values().filter(|item| !item.checked).count());
// We use a memoized signal to filter the todos based on the current filter state.
// Whenever the todos or filter change, the filtered_todos will be recalculated.
// Note that we're only storing the IDs of the todos, not the todos themselves.
let filtered_todos = use_memo(move || {
let mut filtered_todos = todos
.read()
.iter()
.filter(|(_, item)| match filter() {
FilterState::All => true,
FilterState::Active => !item.checked,
FilterState::Completed => item.checked,
})
.map(|f| *f.0)
.collect::<Vec<_>>();
filtered_todos.sort_unstable();
filtered_todos
});
// Toggle all the todos to the opposite of the current state.
// If all todos are checked, uncheck them all. If any are unchecked, check them all.
let toggle_all = move |_| {
let check = active_todo_count() != 0;
for (_, item) in todos.write().iter_mut() {
item.checked = check;
}
};
rsx! {
document::Link { rel: "stylesheet", href: STYLE }
body {
section { class: "todoapp",
TodoHeader { todos }
section { class: "main",
if !todos.read().is_empty() {
input {
id: "toggle-all",
class: "toggle-all",
r#type: "checkbox",
onchange: toggle_all,
checked: active_todo_count() == 0
}
label { r#for: "toggle-all" }
}
// Render the todos using the filtered_todos signal
// We pass the ID into the TodoEntry component so it can access the todo from the todos signal.
// Since we store the todos in a signal too, we also need to send down the todo list
ul { class: "todo-list",
for id in filtered_todos() {
TodoEntry { key: "{id}", id, todos }
}
}
// We only show the footer if there are todos.
if !todos.read().is_empty() {
ListFooter { active_todo_count, todos, filter }
}
}
}
// A simple info footer
footer { class: "info",
p { "Double-click to edit a todo" }
p {
"Created by "
a { href: "http://github.com/jkelleyrtp/", "jkelleyrtp" }
}
p {
"Part of "
a { href: "http://todomvc.com", "TodoMVC" }
}
}
}
}
}
#[component]
fn TodoHeader(mut todos: Signal<HashMap<u32, TodoItem>>) -> Element {
let mut draft = use_signal(|| "".to_string());
let mut todo_id = use_signal(|| 0);
let onkeydown = move |evt: KeyboardEvent| {
if evt.key() == Key::Enter && !draft.read().is_empty() {
let id = todo_id();
let todo = TodoItem {
id,
checked: false,
contents: draft.to_string(),
};
todos.write().insert(id, todo);
todo_id += 1;
draft.set("".to_string());
evt.prevent_default();
}
};
rsx! {
header { class: "header",
h1 { "todos" }
input {
class: "new-todo",
r#type: "text",
placeholder: "What needs to be done?",
value: "{draft}",
autofocus: "true",
oninput: move |evt| draft.set(evt.value()),
onkeydown
}
}
}
}
/// A single todo entry
/// This takes the ID of the todo and the todos signal as props
/// We can use these together to memoize the todo contents and checked state
#[component]
fn TodoEntry(mut todos: Signal<HashMap<u32, TodoItem>>, id: u32) -> Element {
let mut is_editing = use_signal(|| false);
// To avoid re-rendering this component when the todo list changes, we isolate our reads to memos
// This way, the component will only re-render when the contents of the todo change, or when the editing state changes.
// This does involve taking a local clone of the todo contents, but it allows us to prevent this component from re-rendering
let checked = use_memo(move || todos.read().get(&id).unwrap().checked);
let contents = use_memo(move || todos.read().get(&id).unwrap().contents.clone());
rsx! {
li {
// Dioxus lets you use if statements in rsx to conditionally render attributes
// These will get merged into a single class attribute
class: if checked() { "completed" },
class: if is_editing() { "editing" },
// Some basic controls for the todo
div { class: "view",
input {
class: "toggle",
r#type: "checkbox",
id: "cbg-{id}",
checked: "{checked}",
oninput: move |evt| todos.write().get_mut(&id).unwrap().checked = evt.checked()
}
label {
r#for: "cbg-{id}",
onclick: move |evt| {
is_editing.set(true);
evt.prevent_default()
},
"{contents}"
}
button {
class: "destroy",
onclick: move |evt| {
todos.write().remove(&id);
evt.prevent_default();
},
}
}
// Only render the actual input if we're editing
if is_editing() {
input {
class: "edit",
r#type: "text",
value: "{contents}",
oninput: move |evt| todos.write().get_mut(&id).unwrap().contents = evt.value(),
autofocus: "true",
onfocusout: move |_| is_editing.set(false),
onkeydown: move |evt| {
if matches!(evt.key(), Key::Enter | Key::Escape | Key::Tab) {
evt.prevent_default();
is_editing.set(false);
}
}
}
}
}
}
}
#[component]
fn ListFooter(
mut todos: Signal<HashMap<u32, TodoItem>>,
active_todo_count: ReadOnlySignal<usize>,
mut filter: Signal<FilterState>,
) -> Element {
// We use a memoized signal to calculate whether we should show the "Clear completed" button.
// This will recompute whenever the todos change, and if the value is true, the button will be shown.
let show_clear_completed = use_memo(move || todos.read().values().any(|todo| todo.checked));
rsx! {
footer { class: "footer",
span { class: "todo-count",
strong { "{active_todo_count} " }
span {
match active_todo_count() {
1 => "item",
_ => "items",
},
" left"
}
}
ul { class: "filters",
for (state , state_text , url) in [
(FilterState::All, "All", "#/"),
(FilterState::Active, "Active", "#/active"),
(FilterState::Completed, "Completed", "#/completed"),
] {
li {
a {
href: url,
class: if filter() == state { "selected" },
onclick: move |evt| {
filter.set(state);
evt.prevent_default();
},
{state_text}
}
}
}
}
if show_clear_completed() {
button {
class: "clear-completed",
onclick: move |_| todos.write().retain(|_, todo| !todo.checked),
"Clear completed"
}
}
}
}
}
+24
View File
@@ -0,0 +1,24 @@
[package]
name = "dioxus-asset-resolver"
edition = "2021"
version.workspace = true
authors = ["Jonathan Kelley", "Dioxus Labs"]
description = "Cross-platform asset resolver for manganis and dioxus"
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com"
keywords = ["web", "desktop", "mobile", "gui", "wasm"]
rust-version = "1.79.0"
[dependencies]
http = { workspace = true }
urlencoding = { workspace = true }
infer = { workspace = true }
thiserror = { workspace = true }
dioxus-cli-config = { workspace = true }
[target.'cfg(target_os = "android")'.dependencies]
jni = "0.21.1"
ndk = { version = "0.9.0" }
ndk-sys = { version = "0.6.0" }
ndk-context = { version = "0.1.1" }
+180
View File
@@ -0,0 +1,180 @@
use http::{status::StatusCode, Response};
use std::path::{Path, PathBuf};
#[non_exhaustive]
#[derive(Debug, thiserror::Error)]
pub enum AssetServeError {
#[error("Failed to infer mime type for asset: {0}")]
InferringMimeType(std::io::Error),
#[error("Failed to serve asset: {0}")]
IoError(#[from] std::io::Error),
#[error("Failed to construct response: {0}")]
ResponseError(#[from] http::Error),
}
pub fn serve_asset_from_raw_path(path: &str) -> Result<Response<Vec<u8>>, AssetServeError> {
// If the user provided a custom asset handler, then call it and return the response if the request was handled.
// The path is the first part of the URI, so we need to trim the leading slash.
let mut uri_path = PathBuf::from(
urlencoding::decode(path)
.expect("expected URL to be UTF-8 encoded")
.as_ref(),
);
// Attempt to serve from the asset dir on android using its loader
#[cfg(target_os = "android")]
{
if let Some(asset) = to_java_load_asset(path) {
return Ok(Response::builder()
.header("Content-Type", get_mime_by_ext(&uri_path))
.header("Access-Control-Allow-Origin", "*")
.body(asset)?);
}
}
// If the asset doesn't exist, or starts with `/assets/`, then we'll try to serve out of the bundle
// This lets us handle both absolute and relative paths without being too "special"
// It just means that our macos bundle is a little "special" because we need to place an `assets`
// dir in the `Resources` dir.
//
// If there's no asset root, we use the cargo manifest dir as the root, or the current dir
if !uri_path.exists() || uri_path.starts_with("/assets/") {
let bundle_root = get_asset_root();
let relative_path = uri_path.strip_prefix("/").unwrap();
uri_path = bundle_root.join(relative_path);
}
// If the asset exists, then we can serve it!
if uri_path.exists() {
let mime_type =
get_mime_from_path(&uri_path).map_err(AssetServeError::InferringMimeType)?;
let body = std::fs::read(uri_path)?;
return Ok(Response::builder()
.header("Content-Type", mime_type)
.header("Access-Control-Allow-Origin", "*")
.body(body)?);
}
Ok(Response::builder()
.status(StatusCode::NOT_FOUND)
.body(String::from("Not Found").into_bytes())?)
}
/// Get the asset directory, following tauri/cargo-bundles directory discovery approach
///
/// Currently supports:
/// - [x] macOS
/// - [x] iOS
/// - [x] Windows
/// - [x] Linux (appimage)
/// - [ ] Linux (rpm)
/// - [ ] Linux (deb)
/// - [ ] Android
#[allow(unused)]
fn get_asset_root() -> PathBuf {
let cur_exe = std::env::current_exe().unwrap();
#[cfg(target_os = "macos")]
{
return cur_exe
.parent()
.unwrap()
.parent()
.unwrap()
.join("Resources");
}
// For all others, the structure looks like this:
// app.(exe/appimage)
// main.exe
// assets/
cur_exe.parent().unwrap().to_path_buf()
}
/// Get the mime type from a path-like string
fn get_mime_from_path(asset: &Path) -> std::io::Result<&'static str> {
if asset.extension().is_some_and(|ext| ext == "svg") {
return Ok("image/svg+xml");
}
match infer::get_from_path(asset)?.map(|f| f.mime_type()) {
Some(f) if f != "text/plain" => Ok(f),
_other => Ok(get_mime_by_ext(asset)),
}
}
/// Get the mime type from a URI using its extension
fn get_mime_by_ext(trimmed: &Path) -> &'static str {
match trimmed.extension().and_then(|e| e.to_str()) {
// The common assets are all utf-8 encoded
Some("js") => "text/javascript; charset=utf-8",
Some("css") => "text/css; charset=utf-8",
Some("json") => "application/json; charset=utf-8",
Some("svg") => "image/svg+xml; charset=utf-8",
Some("html") => "text/html; charset=utf-8",
// the rest... idk? probably not
Some("mjs") => "text/javascript; charset=utf-8",
Some("bin") => "application/octet-stream",
Some("csv") => "text/csv",
Some("ico") => "image/vnd.microsoft.icon",
Some("jsonld") => "application/ld+json",
Some("rtf") => "application/rtf",
Some("mp4") => "video/mp4",
// Assume HTML when a TLD is found for eg. `dioxus:://dioxuslabs.app` | `dioxus://hello.com`
Some(_) => "text/html; charset=utf-8",
// https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
// using octet stream according to this:
None => "application/octet-stream",
}
}
#[cfg(target_os = "android")]
pub(crate) fn to_java_load_asset(filepath: &str) -> Option<Vec<u8>> {
let normalized = filepath
.trim_start_matches("/assets/")
.trim_start_matches('/');
// in debug mode, the asset might be under `/data/local/tmp/dx/` - attempt to read it from there if it exists
#[cfg(debug_assertions)]
{
let path = dioxus_cli_config::android_session_cache_dir().join(normalized);
if path.exists() {
return std::fs::read(path).ok();
}
}
use std::ptr::NonNull;
let ctx = ndk_context::android_context();
let vm = unsafe { jni::JavaVM::from_raw(ctx.vm().cast()) }.unwrap();
let mut env = vm.attach_current_thread().unwrap();
// Query the Asset Manager
let asset_manager_ptr = env
.call_method(
unsafe { jni::objects::JObject::from_raw(ctx.context().cast()) },
"getAssets",
"()Landroid/content/res/AssetManager;",
&[],
)
.expect("Failed to get asset manager")
.l()
.expect("Failed to get asset manager as object");
unsafe {
let asset_manager =
ndk_sys::AAssetManager_fromJava(env.get_native_interface(), *asset_manager_ptr);
let asset_manager = ndk::asset::AssetManager::from_ptr(
NonNull::new(asset_manager).expect("Invalid asset manager"),
);
let cstr = std::ffi::CString::new(normalized).unwrap();
let mut asset = asset_manager.open(&cstr)?;
Some(asset.buffer().unwrap().to_vec())
}
}
+4 -4
View File
@@ -108,7 +108,7 @@ impl Builder {
self.expected_crates = *crate_count;
}
}
BuildStage::InstallingTooling {} => {}
BuildStage::InstallingTooling => {}
BuildStage::Compiling {
current,
total,
@@ -127,12 +127,12 @@ impl Builder {
self.compile_start = Some(Instant::now());
}
}
BuildStage::Bundling {} => {
BuildStage::Bundling => {
self.complete_compile();
self.bundling_progress = 0.0;
self.bundle_start = Some(Instant::now());
}
BuildStage::OptimizingWasm {} => {}
BuildStage::OptimizingWasm => {}
BuildStage::CopyingAssets { current, total, .. } => {
self.bundling_progress = *current as f64 / *total as f64;
}
@@ -153,7 +153,7 @@ impl Builder {
self.expected_crates = 1;
self.bundling_progress = 0.0;
}
BuildStage::RunningBindgen {} => {}
BuildStage::RunningBindgen => {}
_ => {}
}
}
+13 -4
View File
@@ -21,19 +21,20 @@ pub(crate) async fn pre_render_static_routes(server_exe: &Path) -> anyhow::Resul
let address = &address;
let port = &port;
tracing::info!("Running SSG at http://{address}:{port}");
tracing::info!("Running SSG at http://{address}:{port} for {server_exe:?}");
// Run the server executable
let _child = Command::new(server_exe)
.env(dioxus_cli_config::SERVER_PORT_ENV, port)
.env(dioxus_cli_config::SERVER_IP_ENV, address)
.stdout(std::process::Stdio::piped())
.stderr(std::process::Stdio::piped())
.current_dir(server_exe.parent().unwrap())
.stdout(std::process::Stdio::null())
.stderr(std::process::Stdio::null())
.kill_on_drop(true)
.spawn()?;
let reqwest_client = reqwest::Client::new();
// Borrow reqwest_client so we only move the reference into the futures
let reqwest_client = reqwest::Client::new();
let reqwest_client = &reqwest_client;
// Get the routes from the `/static_routes` endpoint
@@ -42,8 +43,13 @@ pub(crate) async fn pre_render_static_routes(server_exe: &Path) -> anyhow::Resul
// The server may take a few seconds to start up. Try fetching the route up to 5 times with a one second delay
const RETRY_ATTEMPTS: usize = 5;
for i in 0..=RETRY_ATTEMPTS {
tracing::debug!(
"Attempting to get static routes from server. Attempt {i} of {RETRY_ATTEMPTS}"
);
let request = reqwest_client
.post(format!("http://{address}:{port}/api/static_routes"))
.body("{}".to_string())
.send()
.await;
match request {
@@ -75,12 +81,14 @@ pub(crate) async fn pre_render_static_routes(server_exe: &Path) -> anyhow::Resul
.into_iter()
.map(|route| async move {
tracing::info!("Rendering {route} for SSG");
// For each route, ping the server to force it to cache the response for ssg
let request = reqwest_client
.get(format!("http://{address}:{port}{route}"))
.header("Accept", "text/html")
.send()
.await?;
// If it takes longer than 30 seconds to resolve the route, log a warning
let warning_task = tokio::spawn({
let route = route.clone();
@@ -89,6 +97,7 @@ pub(crate) async fn pre_render_static_routes(server_exe: &Path) -> anyhow::Resul
tracing::warn!("Route {route} has been rendering for 30 seconds");
}
});
// Wait for the streaming response to completely finish before continuing. We don't use the html it returns directly
// because it may contain artifacts of intermediate streaming steps while the page is loading. The SSG app should write
// the final clean HTML to the disk automatically after the request completes.
+1 -1
View File
@@ -686,7 +686,7 @@ impl DioxusCrate {
.flatten()
.map(|dir| (dir.file_name(), dir.path()))
.sorted()
.last()
.next_back()
.map(|(_, path)| path.to_path_buf())
});
+1 -1
View File
@@ -160,7 +160,7 @@ impl Platform {
pub(crate) fn autodetect_from_cargo_feature(feature: &str) -> Option<Self> {
match feature {
"web" => Some(Platform::Web),
"desktop" => {
"desktop" | "native" => {
#[cfg(target_os = "macos")]
{
Some(Platform::MacOS)
+7 -7
View File
@@ -521,7 +521,7 @@ impl Output {
match &state.build_engine.stage {
BuildStage::Initializing => lines.push("Initializing".yellow()),
BuildStage::Starting { .. } => lines.push("Starting build".yellow()),
BuildStage::InstallingTooling {} => lines.push("Installing tooling".yellow()),
BuildStage::InstallingTooling => lines.push("Installing tooling".yellow()),
BuildStage::Compiling {
current,
total,
@@ -532,13 +532,13 @@ impl Output {
lines.push(format!("{current}/{total} ").gray());
lines.push(krate.as_str().dark_gray())
}
BuildStage::OptimizingWasm {} => lines.push("Optimizing wasm".yellow()),
BuildStage::SplittingBundle {} => lines.push("Splitting bundle".yellow()),
BuildStage::OptimizingWasm => lines.push("Optimizing wasm".yellow()),
BuildStage::SplittingBundle => lines.push("Splitting bundle".yellow()),
BuildStage::CompressingAssets => lines.push("Compressing assets".yellow()),
BuildStage::PrerenderingRoutes {} => lines.push("Prerendering static routes".yellow()),
BuildStage::RunningBindgen {} => lines.push("Running wasm-bindgen".yellow()),
BuildStage::RunningGradle {} => lines.push("Running gradle assemble".yellow()),
BuildStage::Bundling {} => lines.push("Bundling app".yellow()),
BuildStage::PrerenderingRoutes => lines.push("Prerendering static routes".yellow()),
BuildStage::RunningBindgen => lines.push("Running wasm-bindgen".yellow()),
BuildStage::RunningGradle => lines.push("Running gradle assemble".yellow()),
BuildStage::Bundling => lines.push("Bundling app".yellow()),
BuildStage::CopyingAssets {
current,
total,
+2 -2
View File
@@ -252,7 +252,7 @@ impl WebServer {
BuildStage::Failed => self.send_reload_failed().await,
BuildStage::Restarting => self.send_reload_start().await,
BuildStage::Initializing => {}
BuildStage::InstallingTooling {} => {}
BuildStage::InstallingTooling => {}
BuildStage::Compiling {
current,
total,
@@ -267,7 +267,7 @@ impl WebServer {
self.send_build_status().await;
}
}
BuildStage::OptimizingWasm {} => {}
BuildStage::OptimizingWasm => {}
BuildStage::Aborted => {}
BuildStage::CopyingAssets { .. } => {}
_ => {}
+1
View File
@@ -378,6 +378,7 @@ pub struct Template {
// Are identical static items merged in the current build. Rust doesn't have a cfg(merge_statics) attribute
// so we have to check this manually
#[allow(unpredictable_function_pointer_comparisons)]
fn static_items_merged() -> bool {
fn a() {}
fn b() {}
+3 -2
View File
@@ -20,6 +20,7 @@ dioxus-document = { workspace = true }
dioxus-signals = { workspace = true, optional = true }
dioxus-interpreter-js = { workspace = true, features = ["binary-protocol", "serialize"] }
dioxus-cli-config = { workspace = true }
dioxus-asset-resolver = { workspace = true }
generational-box = { workspace = true }
# hotreload only works on desktop platforms.... mobile is still wip
dioxus-devtools = { workspace = true, optional = true }
@@ -44,13 +45,13 @@ tokio = { workspace = true, features = [
"io-util",
], optional = true }
webbrowser = "0.8.0"
infer = "0.11.0"
infer = { workspace = true }
dunce = { workspace = true }
slab = { workspace = true }
rustc-hash = { workspace = true }
dioxus-hooks = { workspace = true }
futures-util = { workspace = true }
urlencoding = "2.1.2"
urlencoding = { workspace = true }
async-trait = "0.1.68"
tao = { workspace = true, features = ["rwh_05"] }
once_cell = { workspace = true }
+2 -166
View File
@@ -2,10 +2,9 @@ use crate::document::NATIVE_EVAL_JS;
use crate::{assets::*, webview::WebviewEdits};
use dioxus_interpreter_js::unified_bindings::SLEDGEHAMMER_JS;
use dioxus_interpreter_js::NATIVE_JS;
use std::path::{Path, PathBuf};
use wry::{
http::{status::StatusCode, Request, Response},
RequestAsyncResponder, Result,
RequestAsyncResponder,
};
#[cfg(any(target_os = "android", target_os = "windows"))]
@@ -64,7 +63,7 @@ pub(super) fn desktop_handler(
}
}
match serve_asset(request) {
match dioxus_asset_resolver::serve_asset_from_raw_path(request.uri().path()) {
Ok(res) => responder.respond(res),
Err(_e) => responder.respond(
Response::builder()
@@ -75,52 +74,6 @@ pub(super) fn desktop_handler(
}
}
fn serve_asset(request: Request<Vec<u8>>) -> Result<Response<Vec<u8>>> {
// If the user provided a custom asset handler, then call it and return the response if the request was handled.
// The path is the first part of the URI, so we need to trim the leading slash.
let mut uri_path = PathBuf::from(
urlencoding::decode(request.uri().path())
.expect("expected URL to be UTF-8 encoded")
.as_ref(),
);
// Attempt to serve from the asset dir on android using its loader
#[cfg(target_os = "android")]
{
if let Some(asset) = to_java_load_asset(request.uri().path()) {
return Ok(Response::builder()
.header("Content-Type", get_mime_by_ext(&uri_path))
.header("Access-Control-Allow-Origin", "*")
.body(asset)?);
}
}
// If the asset doesn't exist, or starts with `/assets/`, then we'll try to serve out of the bundle
// This lets us handle both absolute and relative paths without being too "special"
// It just means that our macos bundle is a little "special" because we need to place an `assets`
// dir in the `Resources` dir.
//
// If there's no asset root, we use the cargo manifest dir as the root, or the current dir
if !uri_path.exists() || uri_path.starts_with("/assets/") {
let bundle_root = get_asset_root();
let relative_path = uri_path.strip_prefix("/").unwrap();
uri_path = bundle_root.join(relative_path);
}
// If the asset exists, then we can serve it!
if uri_path.exists() {
let mime_type = get_mime_from_path(&uri_path);
return Ok(Response::builder()
.header("Content-Type", mime_type?)
.header("Access-Control-Allow-Origin", "*")
.body(std::fs::read(uri_path)?)?);
}
Ok(Response::builder()
.status(StatusCode::NOT_FOUND)
.body(String::from("Not Found").into_bytes())?)
}
/// Build the index.html file we use for bootstrapping a new app
///
/// We use wry/webview by building a special index.html that forms a bridge between the webview and your rust code
@@ -203,120 +156,3 @@ fn module_loader(root_id: &str, headless: bool) -> String {
"#
)
}
/// Get the asset directory, following tauri/cargo-bundles directory discovery approach
///
/// Currently supports:
/// - [x] macOS
/// - [x] iOS
/// - [x] Windows
/// - [x] Linux (appimage)
/// - [ ] Linux (rpm)
/// - [ ] Linux (deb)
/// - [ ] Android
#[allow(unreachable_code)]
fn get_asset_root() -> PathBuf {
let cur_exe = std::env::current_exe().unwrap();
#[cfg(target_os = "macos")]
{
return cur_exe
.parent()
.unwrap()
.parent()
.unwrap()
.join("Resources");
}
// For all others, the structure looks like this:
// app.(exe/appimage)
// main.exe
// assets/
cur_exe.parent().unwrap().to_path_buf()
}
/// Get the mime type from a path-like string
fn get_mime_from_path(asset: &Path) -> Result<&'static str> {
if asset.extension().is_some_and(|ext| ext == "svg") {
return Ok("image/svg+xml");
}
match infer::get_from_path(asset)?.map(|f| f.mime_type()) {
Some(f) if f != "text/plain" => Ok(f),
_other => Ok(get_mime_by_ext(asset)),
}
}
/// Get the mime type from a URI using its extension
fn get_mime_by_ext(trimmed: &Path) -> &'static str {
match trimmed.extension().and_then(|e| e.to_str()) {
// The common assets are all utf-8 encoded
Some("js") => "text/javascript; charset=utf-8",
Some("css") => "text/css; charset=utf-8",
Some("json") => "application/json; charset=utf-8",
Some("svg") => "image/svg+xml; charset=utf-8",
Some("html") => "text/html; charset=utf-8",
// the rest... idk? probably not
Some("mjs") => "text/javascript; charset=utf-8",
Some("bin") => "application/octet-stream",
Some("csv") => "text/csv",
Some("ico") => "image/vnd.microsoft.icon",
Some("jsonld") => "application/ld+json",
Some("rtf") => "application/rtf",
Some("mp4") => "video/mp4",
// Assume HTML when a TLD is found for eg. `dioxus:://dioxuslabs.app` | `dioxus://hello.com`
Some(_) => "text/html; charset=utf-8",
// https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
// using octet stream according to this:
None => "application/octet-stream",
}
}
#[cfg(target_os = "android")]
pub(crate) fn to_java_load_asset(filepath: &str) -> Option<Vec<u8>> {
let normalized = filepath
.trim_start_matches("/assets/")
.trim_start_matches('/');
// in debug mode, the asset might be under `/data/local/tmp/dx/` - attempt to read it from there if it exists
#[cfg(debug_assertions)]
{
let path = dioxus_cli_config::android_session_cache_dir().join(normalized);
if path.exists() {
return std::fs::read(path).ok();
}
}
use std::ptr::NonNull;
let ctx = ndk_context::android_context();
let vm = unsafe { jni::JavaVM::from_raw(ctx.vm().cast()) }.unwrap();
let mut env = vm.attach_current_thread().unwrap();
// Query the Asset Manager
let asset_manager_ptr = env
.call_method(
unsafe { jni::objects::JObject::from_raw(ctx.context().cast()) },
"getAssets",
"()Landroid/content/res/AssetManager;",
&[],
)
.expect("Failed to get asset manager")
.l()
.expect("Failed to get asset manager as object");
unsafe {
let asset_manager =
ndk_sys::AAssetManager_fromJava(env.get_native_interface(), *asset_manager_ptr);
let asset_manager = ndk::asset::AssetManager::from_ptr(
NonNull::new(asset_manager).expect("Invalid asset manager"),
);
let cstr = std::ffi::CString::new(normalized).unwrap();
let mut asset = asset_manager.open(&cstr)?;
Some(asset.buffer().unwrap().to_vec())
}
}
+2
View File
@@ -27,6 +27,7 @@ dioxus-desktop = { workspace = true, default-features = true, optional = true }
dioxus-fullstack = { workspace = true, default-features = true, optional = true }
dioxus-liveview = { workspace = true, optional = true }
dioxus-ssr = { workspace = true, optional = true }
dioxus-native = { workspace = true, optional = true }
manganis = { workspace = true, features = ["dioxus"], optional = true }
dioxus-logger = { workspace = true, optional = true }
warnings = { workspace = true, optional = true }
@@ -66,6 +67,7 @@ web = ["dep:dioxus-web", "dioxus-fullstack?/web", "dioxus-config-macro/web", "de
ssr = ["dep:dioxus-ssr", "dioxus-config-macro/ssr"]
liveview = ["dep:dioxus-liveview", "dioxus-config-macro/liveview"]
server = ["dioxus-fullstack?/axum", "dioxus-fullstack?/server", "ssr", "dioxus-liveview?/axum"]
native = ["dep:dioxus-native"] # todo(jon): decompose the desktop crate such that "webview" is the default and native is opt-in
# This feature just disables the no-renderer-enabled warning
third-party-renderer = []
+145 -121
View File
@@ -6,10 +6,58 @@ use std::any::Any;
use crate::prelude::*;
/// Launch your Dioxus application with the given root component, context and config.
/// The platform will be determined from cargo features.
///
/// For a builder API, see `LaunchBuilder` defined in the `dioxus` crate.
///
/// # Feature selection
///
/// - `web`: Enables the web platform.
/// - `desktop`: Enables the desktop platform.
/// - `mobile`: Enables the mobile (ios + android webview) platform.
/// - `server`: Enables the server (axum + server-side-rendering) platform.
/// - `liveview`: Enables the liveview (websocke) platform.
/// - `native`: Enables the native (wgpu + winit renderer) platform.
///
/// Currently `native` is its own platform that is not compatible with desktop or mobile since it
/// unifies both platforms into one. If "desktop" and "native" are enabled, then the native renderer
/// will be used.
///
/// # Feature priority
///
/// If multiple renderers are enabled, the order of priority goes:
///
/// 1. liveview
/// 2. server
/// 3. native
/// 4. desktop
/// 5. mobile
/// 6. web
///
/// However, we don't recommend enabling multiple renderers at the same time due to feature conflicts
/// and bloating of the binary size.
///
/// # Example
/// ```rust, no_run
/// # use dioxus::prelude::*;
///
/// dioxus::launch(app);
/// fn app() -> Element {
/// rsx! {
/// div { "Hello, world!" }
/// }
/// }
/// ```
pub fn launch(app: fn() -> Element) {
#[allow(deprecated)]
LaunchBuilder::new().launch(app)
}
/// A builder for a fullstack app.
#[must_use]
pub struct LaunchBuilder {
launch_fn: LaunchFn,
platform: KnownPlatform,
contexts: Vec<ContextFn>,
configs: Vec<Box<dyn Any>>,
}
@@ -19,6 +67,16 @@ pub type LaunchFn = fn(fn() -> Element, Vec<ContextFn>, Vec<Box<dyn Any>>);
/// A context function is a Send and Sync closure that returns a boxed trait object
pub type ContextFn = Box<dyn Fn() -> Box<dyn Any> + Send + Sync + 'static>;
enum KnownPlatform {
Web,
Desktop,
Mobile,
Server,
Liveview,
Native,
Other(LaunchFn),
}
#[allow(clippy::redundant_closure)] // clippy doesnt doesn't understand our coercion to fn
impl LaunchBuilder {
/// Create a new builder for your application. This will create a launch configuration for the current platform based on the features enabled on the `dioxus` crate.
@@ -38,9 +96,24 @@ impl LaunchBuilder {
)
)]
pub fn new() -> LaunchBuilder {
let platform = if cfg!(feature = "liveview") {
KnownPlatform::Liveview
} else if cfg!(feature = "server") {
KnownPlatform::Server
} else if cfg!(feature = "native") {
KnownPlatform::Native
} else if cfg!(feature = "desktop") {
KnownPlatform::Desktop
} else if cfg!(feature = "mobile") {
KnownPlatform::Mobile
} else if cfg!(feature = "web") {
KnownPlatform::Web
} else {
panic!("No platform feature enabled. Please enable one of the following features: liveview, desktop, mobile, web, tui, fullstack to use the launch API.")
};
LaunchBuilder {
// We can't use the `current_platform::launch` function directly because it may return ! or ()
launch_fn: |root, contexts, cfg| current_platform::launch(root, contexts, cfg),
platform,
contexts: Vec::new(),
configs: Vec::new(),
}
@@ -51,7 +124,7 @@ impl LaunchBuilder {
#[cfg_attr(docsrs, doc(cfg(feature = "web")))]
pub fn web() -> LaunchBuilder {
LaunchBuilder {
launch_fn: web_launch,
platform: KnownPlatform::Web,
contexts: Vec::new(),
configs: Vec::new(),
}
@@ -62,7 +135,7 @@ impl LaunchBuilder {
#[cfg_attr(docsrs, doc(cfg(feature = "desktop")))]
pub fn desktop() -> LaunchBuilder {
LaunchBuilder {
launch_fn: |root, contexts, cfg| dioxus_desktop::launch::launch(root, contexts, cfg),
platform: KnownPlatform::Desktop,
contexts: Vec::new(),
configs: Vec::new(),
}
@@ -73,9 +146,7 @@ impl LaunchBuilder {
#[cfg_attr(docsrs, doc(cfg(all(feature = "fullstack", feature = "server"))))]
pub fn server() -> LaunchBuilder {
LaunchBuilder {
launch_fn: |root, contexts, cfg| {
dioxus_fullstack::server::launch::launch(root, contexts, cfg)
},
platform: KnownPlatform::Server,
contexts: Vec::new(),
configs: Vec::new(),
}
@@ -86,7 +157,7 @@ impl LaunchBuilder {
#[cfg_attr(docsrs, doc(cfg(feature = "mobile")))]
pub fn mobile() -> LaunchBuilder {
LaunchBuilder {
launch_fn: |root, contexts, cfg| dioxus_mobile::launch_cfg(root, contexts, cfg),
platform: KnownPlatform::Mobile,
contexts: Vec::new(),
configs: Vec::new(),
}
@@ -121,14 +192,12 @@ impl LaunchBuilder {
/// ```
pub fn custom(launch_fn: LaunchFn) -> LaunchBuilder {
LaunchBuilder {
launch_fn,
platform: KnownPlatform::Other(launch_fn),
contexts: vec![],
configs: Vec::new(),
}
}
}
impl LaunchBuilder {
/// Inject state into the root component's context that is created on the thread that the app is launched on.
///
/// # Example
@@ -186,9 +255,7 @@ impl LaunchBuilder {
.push(Box::new(move || Box::new(state.clone())));
self
}
}
impl LaunchBuilder {
/// Provide a platform-specific config to the builder.
///
/// # Example
@@ -211,13 +278,28 @@ impl LaunchBuilder {
self
}
fn launch_inner(self, app: fn() -> Element) {
/// Launch your application.
///
#[allow(clippy::diverging_sub_expression)]
pub fn launch(self, app: fn() -> Element) {
let Self {
platform,
contexts,
configs,
} = self;
// Make sure to turn on the logger if the user specified the logger feaature
#[cfg(feature = "logger")]
dioxus_logger::initialize_default();
#[cfg(all(feature = "fullstack", any(feature = "desktop", feature = "mobile")))]
// Set any flags if we're running under fullstack
#[cfg(feature = "fullstack")]
{
use dioxus_fullstack::prelude::server_fn::client::{get_server_url, set_server_url};
// Make sure to set the server_fn endpoint if the user specified the fullstack feature
// We only set this on native targets
#[cfg(any(feature = "desktop", feature = "mobile", feature = "native"))]
if get_server_url().is_empty() {
let serverurl = format!(
"http://{}:{}",
@@ -226,143 +308,85 @@ impl LaunchBuilder {
std::env::var("DIOXUS_DEVSERVER_PORT").unwrap_or_else(|_| "8080".to_string())
)
.leak();
set_server_url(serverurl);
}
// If there is a base path set, call server functions from that base path
#[cfg(feature = "web")]
if let Some(base_path) = dioxus_cli_config::base_path() {
let base_path = base_path.trim_matches('/');
set_server_url(format!("{}/{}", get_server_url(), base_path).leak());
}
}
let cfg = self.configs;
(self.launch_fn)(app, self.contexts, cfg);
// If native is specified, we override the webview launcher
#[cfg(feature = "native")]
if matches!(platform, KnownPlatform::Native) {
return dioxus_native::launch_cfg(app, contexts, configs);
}
/// Launch your application.
pub fn launch(self, app: fn() -> Element) {
self.launch_inner(app);
}
}
/// Re-export the platform we expect the user wants
///
/// If multiple platforms are enabled, we use this priority (from highest to lowest):
/// - `fullstack`
/// - `desktop`
/// - `mobile`
/// - `web`
/// - `liveview`
mod current_platform {
#[cfg(all(feature = "fullstack", feature = "server"))]
pub use dioxus_fullstack::server::launch::*;
#[cfg(all(
feature = "desktop",
not(all(feature = "fullstack", feature = "server"))
))]
pub use dioxus_desktop::launch::*;
#[cfg(all(
feature = "mobile",
not(feature = "desktop"),
not(all(feature = "fullstack", feature = "server"))
))]
pub use dioxus_mobile::launch_bindings::*;
#[cfg(all(
feature = "web",
not(all(feature = "fullstack", feature = "server")),
not(all(feature = "server")),
not(feature = "desktop"),
not(feature = "mobile"),
))]
pub fn launch(
root: fn() -> dioxus_core::Element,
contexts: Vec<super::ContextFn>,
platform_config: Vec<Box<dyn std::any::Any>>,
) {
super::web_launch(root, contexts, platform_config);
#[cfg(feature = "mobile")]
if matches!(platform, KnownPlatform::Mobile) {
return dioxus_mobile::launch_bindings::launch(app, contexts, configs);
}
#[cfg(all(
feature = "liveview",
not(all(feature = "fullstack", feature = "server")),
not(all(feature = "server")),
not(feature = "desktop"),
not(feature = "mobile"),
not(feature = "web"),
))]
pub use dioxus_liveview::launch::*;
#[cfg(not(any(
feature = "liveview",
all(feature = "fullstack", feature = "server"),
all(feature = "server"),
feature = "desktop",
feature = "mobile",
feature = "web",
)))]
pub fn launch(
root: fn() -> dioxus_core::Element,
contexts: Vec<super::ContextFn>,
platform_config: Vec<Box<dyn std::any::Any>>,
) {
#[cfg(feature = "third-party-renderer")]
panic!("No first party renderer feature enabled. It looks like you are trying to use a third party renderer. You will need to use the launch function from the third party renderer crate.");
panic!("No platform feature enabled. Please enable one of the following features: liveview, desktop, mobile, web, tui, fullstack to use the launch API.")
#[cfg(feature = "desktop")]
if matches!(platform, KnownPlatform::Desktop) {
return dioxus_desktop::launch::launch(app, contexts, configs);
}
}
pub fn launch(app: fn() -> Element) {
#[allow(deprecated)]
LaunchBuilder::new().launch(app)
}
#[cfg(feature = "server")]
if matches!(platform, KnownPlatform::Server) {
return dioxus_fullstack::server::launch::launch(app, contexts, configs);
}
#[cfg(feature = "web")]
fn web_launch(
root: fn() -> dioxus_core::Element,
contexts: Vec<super::ContextFn>,
platform_config: Vec<Box<dyn std::any::Any>>,
) {
#[cfg(feature = "web")]
if matches!(platform, KnownPlatform::Web) {
// If the server feature is enabled, launch the client with hydration enabled
#[cfg(feature = "fullstack")]
{
let platform_config = platform_config
let platform_config = configs
.into_iter()
.find_map(|cfg| cfg.downcast::<dioxus_web::Config>().ok())
.unwrap_or_default()
.hydrate(true);
// If there is a base path set, call server functions from that base path
if let Some(base_path) = dioxus_cli_config::web_base_path() {
let base_path = base_path.trim_matches('/');
crate::prelude::server_fn::client::set_server_url(
format!(
"{}/{}",
crate::prelude::server_fn::client::get_server_url(),
base_path
)
.leak(),
);
}
let factory = move || {
let mut vdom = dioxus_core::VirtualDom::new(root);
let mut vdom = dioxus_core::VirtualDom::new(app);
for context in contexts {
vdom.insert_any_root_context(context());
}
#[cfg(feature = "document")]
{
#[cfg(feature = "fullstack")]
use dioxus_fullstack::document;
let document = std::rc::Rc::new(document::web::FullstackWebDocument)
as std::rc::Rc<dyn crate::prelude::document::Document>;
vdom.provide_root_context(document);
}
vdom
};
dioxus_web::launch::launch_virtual_dom(factory(), platform_config)
return dioxus_web::launch::launch_virtual_dom(vdom, platform_config);
}
#[cfg(not(any(feature = "fullstack")))]
dioxus_web::launch::launch(root, contexts, platform_config);
return dioxus_web::launch::launch(app, contexts, configs);
}
#[cfg(feature = "liveview")]
if matches!(platform, KnownPlatform::Liveview) {
return dioxus_liveview::launch::launch(app, contexts, configs);
}
// If the platform is not one of the above, then we assume it's a custom platform
if let KnownPlatform::Other(launch_fn) = platform {
return launch_fn(app, contexts, configs);
}
// If we're here, then we have no platform feature enabled and third-party-renderer is enabled
if cfg!(feature = "third-party-renderer") {
panic!("No first party renderer feature enabled. It looks like you are trying to use a third party renderer. You will need to use the launch function from the third party renderer crate.");
}
panic!("No platform feature enabled. Please enable one of the following features: liveview, desktop, mobile, web, tui, fullstack to use the launch API.")
}
}
+1 -1
View File
@@ -21,7 +21,7 @@ tracing = { workspace = true }
slab = { workspace = true }
futures-util = { workspace = true}
generational-box.workspace = true
rustversion = "1.0.17"
rustversion = { workspace = true }
warnings = { workspace = true }
[dev-dependencies]
+1 -1
View File
@@ -28,7 +28,7 @@ tokio = { workspace = true, features = ["fs", "io-util"], optional = true }
futures-channel = { workspace = true }
serde_json = { version = "1", optional = true }
tracing.workspace = true
rustversion = "1.0.17"
rustversion = { workspace = true }
[build-dependencies]
lazy-js-bundle = { workspace = true }
+1
View File
@@ -16,3 +16,4 @@ thiserror = { workspace = true }
rustc-hash = { workspace = true }
lru = { workspace = true }
tracing = { workspace = true }
walkdir = { workspace = true }
+1 -1
View File
@@ -37,7 +37,7 @@ impl IncrementalRendererConfig {
static_dir: PathBuf::from("./static"),
memory_cache_limit: 10000,
invalidate_after: None,
clear_cache: true,
clear_cache: false,
pre_render: false,
#[cfg(not(target_arch = "wasm32"))]
map_path: None,
+20 -2
View File
@@ -55,8 +55,26 @@ impl FileSystemCache {
}
pub fn clear(&mut self) {
// clear the static directory
let _ = std::fs::remove_dir_all(&self.static_dir);
// clear the static directory of index.html files contained within folders
for entry in std::fs::read_dir(&self.static_dir)
.into_iter()
.flatten()
.flatten()
{
if entry.file_type().map(|ft| ft.is_dir()).unwrap_or(false) {
for entry in walkdir::WalkDir::new(entry.path()).into_iter().flatten() {
if entry.file_type().is_file() {
if let Some(fnmae) = entry.file_name().to_str() {
if fnmae.ends_with(".html") {
if let Err(err) = std::fs::remove_file(entry.path()) {
tracing::error!("Failed to remove file: {}", err);
}
}
}
}
}
}
}
}
pub fn invalidate(&mut self, route: &str) {
+59
View File
@@ -0,0 +1,59 @@
[package]
name = "dioxus-native"
version = { workspace = true }
authors = ["Jonathan Kelley", "Nico Burns"]
edition = "2021"
description = "Native renderer for Dioxus based on blitz"
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "react"]
[features]
default = ["accessibility", "hot-reload", "menu", "tracing", "net", "svg"]
svg = ["blitz-dom/svg", "blitz-renderer-vello/svg"]
net = ["dep:tokio", "dep:blitz-net"]
accessibility = ["blitz-shell/accessibility", "blitz-dom/accessibility"]
menu = ["blitz-shell/menu"]
tracing = ["dep:tracing", "blitz-shell/tracing", "blitz-dom/tracing"]
hot-reload = ["dep:dioxus-cli-config", "dep:dioxus-devtools"]
autofocus = []
[dependencies]
# Blitz dependencies
blitz-renderer-vello = { version = "0.1.0-alpha.1", default-features = false }
blitz-dom = { version = "0.1.0-alpha.1", default-features = false }
blitz-net = { version = "0.1.0-alpha.1", optional = true }
blitz-traits = { version = "0.1.0-alpha.1" }
blitz-shell = { version = "0.1.0-alpha.1", default-features = false }
# blitz-renderer-vello = { git = "https://github.com/dioxuslabs/blitz", rev="c1a7ecf06d1760a268e0046dc0e43f6c796ddc3c", default-features = false }
# blitz-dom = { git = "https://github.com/dioxuslabs/blitz", rev="c1a7ecf06d1760a268e0046dc0e43f6c796ddc3c", default-features = false }
# blitz-net = { git = "https://github.com/dioxuslabs/blitz", rev="c1a7ecf06d1760a268e0046dc0e43f6c796ddc3c", optional = true }
# blitz-traits = { git = "https://github.com/dioxuslabs/blitz", rev="c1a7ecf06d1760a268e0046dc0e43f6c796ddc3c" }
# blitz-shell = { git = "https://github.com/dioxuslabs/blitz", rev="c1a7ecf06d1760a268e0046dc0e43f6c796ddc3c", default-features = false }
# DioxusLabs dependencies
dioxus-core = { workspace = true }
dioxus-html = { workspace = true }
dioxus-asset-resolver = { workspace = true }
dioxus-cli-config = { workspace = true, optional = true }
dioxus-devtools = { workspace = true, optional = true }
dioxus-history = { workspace = true }
dioxus-document = { workspace = true }
# Windowing & Input
winit = { workspace = true }
keyboard-types = { workspace = true }
# IO & Networking
tokio = { workspace = true, features = ["rt-multi-thread"], optional = true }
# Other dependencies
tracing = { workspace = true, optional = true }
rustc-hash = { workspace = true }
futures-util = { workspace = true }
[package.metadata.docs.rs]
all-features = true
rustdoc-args = ["--cfg", "docsrs"]
+80
View File
@@ -0,0 +1,80 @@
use blitz_shell::BlitzShellNetCallback;
use std::sync::Arc;
use blitz_dom::{
net::{CssHandler, ImageHandler, Resource},
util::ImageType,
BaseDocument,
};
use blitz_shell::BlitzShellEvent;
use blitz_traits::net::{NetCallback, NetProvider};
use winit::event_loop::EventLoopProxy;
use crate::NodeId;
pub struct DioxusNativeNetProvider {
callback: Arc<dyn NetCallback<Data = Resource> + 'static>,
inner_net_provider: Arc<dyn NetProvider<Data = Resource> + 'static>,
}
impl DioxusNativeNetProvider {
pub fn shared(proxy: EventLoopProxy<BlitzShellEvent>) -> Arc<dyn NetProvider<Data = Resource>> {
Arc::new(Self::new(proxy)) as Arc<dyn NetProvider<Data = Resource>>
}
pub fn new(proxy: EventLoopProxy<BlitzShellEvent>) -> Self {
let net_callback = BlitzShellNetCallback::shared(proxy);
let net_provider = blitz_net::Provider::shared(net_callback.clone());
Self {
callback: net_callback,
inner_net_provider: net_provider,
}
}
}
impl NetProvider for DioxusNativeNetProvider {
type Data = Resource;
fn fetch(
&self,
doc_id: usize,
request: blitz_traits::net::Request,
handler: blitz_traits::net::BoxedHandler<Self::Data>,
) {
if request.url.scheme() == "dioxus" {
match dioxus_asset_resolver::serve_asset_from_raw_path(request.url.path()) {
Ok(res) => {
tracing::trace!("fetching asset from file system success {request:#?}");
handler.bytes(doc_id, res.into_body().into(), self.callback.clone())
}
Err(_) => {
tracing::warn!("fetching asset from file system error {request:#?}");
}
}
} else {
self.inner_net_provider.fetch(doc_id, request, handler);
}
}
}
pub fn fetch_linked_stylesheet(doc: &BaseDocument, node_id: NodeId, queued_url: String) {
let url = doc.resolve_url(&queued_url);
doc.net_provider.fetch(
doc.id(),
blitz_traits::net::Request::get(url.clone()),
Box::new(CssHandler {
node: node_id,
source_url: url,
guard: doc.guard.clone(),
provider: doc.net_provider.clone(),
}),
);
}
pub fn fetch_image(doc: &BaseDocument, node_id: usize, queued_image: String) {
let src = doc.resolve_url(&queued_image);
doc.net_provider.fetch(
doc.id(),
blitz_traits::net::Request::get(src),
Box::new(ImageHandler::new(node_id, ImageType::Image)),
);
}
+70
View File
@@ -0,0 +1,70 @@
use blitz_shell::BlitzShellEvent;
use dioxus_document::{Document, NoOpDocument};
use winit::{event_loop::EventLoopProxy, window::WindowId};
use crate::DioxusNativeEvent;
pub struct DioxusNativeDocument {
pub(crate) proxy: EventLoopProxy<BlitzShellEvent>,
pub(crate) window: WindowId,
}
impl DioxusNativeDocument {
pub(crate) fn new(proxy: EventLoopProxy<BlitzShellEvent>, window: WindowId) -> Self {
Self { proxy, window }
}
}
impl Document for DioxusNativeDocument {
fn eval(&self, _js: String) -> dioxus_document::Eval {
NoOpDocument.eval(_js)
}
fn create_head_element(
&self,
name: &str,
attributes: &[(&str, String)],
contents: Option<String>,
) {
let window = self.window;
_ = self.proxy.send_event(BlitzShellEvent::embedder_event(
DioxusNativeEvent::CreateHeadElement {
name: name.to_string(),
attributes: attributes
.iter()
.map(|(name, value)| (name.to_string(), value.clone()))
.collect(),
contents,
window,
},
));
}
fn set_title(&self, title: String) {
self.create_head_element("title", &[], Some(title));
}
fn create_meta(&self, props: dioxus_document::MetaProps) {
let attributes = props.attributes();
self.create_head_element("meta", &attributes, None);
}
fn create_script(&self, props: dioxus_document::ScriptProps) {
let attributes = props.attributes();
self.create_head_element("script", &attributes, props.script_contents().ok());
}
fn create_style(&self, props: dioxus_document::StyleProps) {
let attributes = props.attributes();
self.create_head_element("style", &attributes, props.style_contents().ok());
}
fn create_link(&self, props: dioxus_document::LinkProps) {
let attributes = props.attributes();
self.create_head_element("link", &attributes, None);
}
fn create_head_component(&self) -> bool {
true
}
}
+166
View File
@@ -0,0 +1,166 @@
use blitz_renderer_vello::BlitzVelloRenderer;
use blitz_shell::BlitzApplication;
use dioxus_core::{ScopeId, VirtualDom};
use dioxus_history::{History, MemoryHistory};
use std::{collections::HashSet, rc::Rc};
use winit::application::ApplicationHandler;
use winit::event::{StartCause, WindowEvent};
use winit::event_loop::{ActiveEventLoop, EventLoopProxy};
use winit::window::WindowId;
use crate::{
assets::DioxusNativeNetProvider, contexts::DioxusNativeDocument,
mutation_writer::MutationWriter, BlitzShellEvent, DioxusDocument, DioxusNativeEvent,
WindowConfig,
};
pub struct DioxusNativeApplication {
pending_vdom: Option<VirtualDom>,
inner: BlitzApplication<DioxusDocument, BlitzVelloRenderer>,
proxy: EventLoopProxy<BlitzShellEvent>,
}
impl DioxusNativeApplication {
pub fn new(proxy: EventLoopProxy<BlitzShellEvent>, vdom: VirtualDom) -> Self {
Self {
pending_vdom: Some(vdom),
inner: BlitzApplication::new(proxy.clone()),
proxy,
}
}
pub fn add_window(&mut self, window_config: WindowConfig<DioxusDocument, BlitzVelloRenderer>) {
self.inner.add_window(window_config);
}
fn handle_blitz_shell_event(
&mut self,
event_loop: &ActiveEventLoop,
event: &DioxusNativeEvent,
) {
match event {
#[cfg(all(
feature = "hot-reload",
debug_assertions,
not(target_os = "android"),
not(target_os = "ios")
))]
DioxusNativeEvent::DevserverEvent(event) => match event {
dioxus_devtools::DevserverMsg::HotReload(hotreload_message) => {
for window in self.inner.windows.values_mut() {
dioxus_devtools::apply_changes(&window.doc.vdom, hotreload_message);
window.poll();
}
}
dioxus_devtools::DevserverMsg::Shutdown => event_loop.exit(),
dioxus_devtools::DevserverMsg::FullReloadStart => {}
dioxus_devtools::DevserverMsg::FullReloadFailed => {}
dioxus_devtools::DevserverMsg::FullReloadCommand => {}
},
DioxusNativeEvent::CreateHeadElement {
name,
attributes,
contents,
window,
} => {
if let Some(window) = self.inner.windows.get_mut(window) {
window.doc.create_head_element(name, attributes, contents);
window.poll();
}
}
// Suppress unused variable warning
#[cfg(not(all(
feature = "hot-reload",
debug_assertions,
not(target_os = "android"),
not(target_os = "ios")
)))]
_ => {
let _ = event_loop;
let _ = event;
}
}
}
}
impl ApplicationHandler<BlitzShellEvent> for DioxusNativeApplication {
fn resumed(&mut self, event_loop: &ActiveEventLoop) {
tracing::debug!("Injecting document provider into all windows");
let vdom = self.pending_vdom.take().unwrap();
#[cfg(feature = "net")]
let net_provider = {
let proxy = self.proxy.clone();
let net_provider = DioxusNativeNetProvider::shared(proxy);
Some(net_provider)
};
#[cfg(not(feature = "net"))]
let net_provider = None;
// Create document + window from the baked virtualdom
let doc = DioxusDocument::new(vdom, net_provider);
let window = WindowConfig::new(doc);
// little hack since View::init is not public - fix this once alpha-2 is out
let old_windows = self.inner.windows.keys().copied().collect::<HashSet<_>>();
self.add_window(window);
self.inner.resumed(event_loop);
let new_windows = self.inner.windows.keys().cloned().collect::<HashSet<_>>();
// todo(jon): we should actually mess with the pending windows instead of passing along the contexts
for window_id in new_windows.difference(&old_windows) {
let window = self.inner.windows.get_mut(window_id).unwrap();
window.doc.vdom.in_runtime(|| {
let shared: Rc<dyn dioxus_document::Document> =
Rc::new(DioxusNativeDocument::new(self.proxy.clone(), *window_id));
ScopeId::ROOT.provide_context(shared);
});
// Add history
let history_provider: Rc<dyn History> = Rc::new(MemoryHistory::default());
window
.doc
.vdom
.in_runtime(|| ScopeId::ROOT.provide_context(history_provider));
// Queue rebuild
let mut writer = MutationWriter::new(&mut window.doc.inner, &mut window.doc.vdom_state);
window.doc.vdom.rebuild(&mut writer);
drop(writer);
// And then request redraw
window.request_redraw();
}
}
fn suspended(&mut self, event_loop: &ActiveEventLoop) {
self.inner.suspended(event_loop);
}
fn new_events(&mut self, event_loop: &ActiveEventLoop, cause: StartCause) {
self.inner.new_events(event_loop, cause);
}
fn window_event(
&mut self,
event_loop: &ActiveEventLoop,
window_id: WindowId,
event: WindowEvent,
) {
self.inner.window_event(event_loop, window_id, event);
}
fn user_event(&mut self, event_loop: &ActiveEventLoop, event: BlitzShellEvent) {
match event {
BlitzShellEvent::Embedder(event) => {
if let Some(event) = event.downcast_ref::<DioxusNativeEvent>() {
self.handle_blitz_shell_event(event_loop, event);
}
}
event => self.inner.user_event(event_loop, event),
}
}
}
+564
View File
@@ -0,0 +1,564 @@
//! Integration between Dioxus and Blitz
use std::{any::Any, collections::HashMap, rc::Rc, sync::Arc};
use blitz_dom::{
local_name, namespace_url,
net::Resource,
node::{Attribute, NodeSpecificData},
ns, Atom, BaseDocument, ElementNodeData, Node, NodeData, QualName, DEFAULT_CSS,
};
use blitz_traits::{net::NetProvider, ColorScheme, Document, DomEvent, DomEventData, Viewport};
use dioxus_core::{ElementId, Event, VirtualDom};
use dioxus_html::{set_event_converter, FormValue, PlatformEventData};
use futures_util::{pin_mut, FutureExt};
use super::event_handler::{BlitzKeyboardData, NativeClickData, NativeConverter, NativeFormData};
use crate::mutation_writer::{DioxusState, MutationWriter};
use crate::NodeId;
pub(crate) fn qual_name(local_name: &str, namespace: Option<&str>) -> QualName {
QualName {
prefix: None,
ns: namespace.map(Atom::from).unwrap_or(ns!(html)),
local: Atom::from(local_name),
}
}
pub struct DioxusDocument {
pub(crate) vdom: VirtualDom,
pub(crate) vdom_state: DioxusState,
pub(crate) inner: BaseDocument,
#[allow(unused)]
pub(crate) html_element_id: NodeId,
#[allow(unused)]
pub(crate) head_element_id: NodeId,
#[allow(unused)]
pub(crate) body_element_id: NodeId,
#[allow(unused)]
pub(crate) main_element_id: NodeId,
}
// Implement DocumentLike and required traits for DioxusDocument
impl AsRef<BaseDocument> for DioxusDocument {
fn as_ref(&self) -> &BaseDocument {
&self.inner
}
}
impl AsMut<BaseDocument> for DioxusDocument {
fn as_mut(&mut self) -> &mut BaseDocument {
&mut self.inner
}
}
impl From<DioxusDocument> for BaseDocument {
fn from(doc: DioxusDocument) -> BaseDocument {
doc.inner
}
}
impl Document for DioxusDocument {
type Doc = BaseDocument;
fn poll(&mut self, mut cx: std::task::Context) -> bool {
{
let fut = self.vdom.wait_for_work();
pin_mut!(fut);
match fut.poll_unpin(&mut cx) {
std::task::Poll::Ready(_) => {}
std::task::Poll::Pending => return false,
}
}
let mut writer = MutationWriter::new(&mut self.inner, &mut self.vdom_state);
self.vdom.render_immediate(&mut writer);
true
}
fn id(&self) -> usize {
self.inner.id()
}
fn handle_event(&mut self, event: &mut DomEvent) {
let chain = self.inner.node_chain(event.target);
set_event_converter(Box::new(NativeConverter {}));
let renderer_event = event.clone();
let mut prevent_default = false;
let mut stop_propagation = false;
match &event.data {
DomEventData::MouseMove(data)
| DomEventData::MouseDown(data)
| DomEventData::MouseUp(data) => {
let click_event_data = wrap_event_data(NativeClickData(data.clone()));
for node_id in chain.clone().into_iter() {
let node = &self.inner.tree()[node_id];
let dioxus_id = node.element_data().and_then(DioxusDocument::dioxus_id);
if let Some(id) = dioxus_id {
let click_event = Event::new(click_event_data.clone(), true);
self.vdom
.runtime()
.handle_event(event.name(), click_event.clone(), id);
prevent_default |= !click_event.default_action_enabled();
stop_propagation |= !click_event.propagates();
}
if !event.bubbles || stop_propagation {
break;
}
}
}
DomEventData::Click(data) => {
let click_event_data = wrap_event_data(NativeClickData(data.clone()));
for node_id in chain.clone().into_iter() {
let node = &self.inner.tree()[node_id];
let dioxus_id = node.element_data().and_then(DioxusDocument::dioxus_id);
let mut trigger_label = false;
if let Some(id) = dioxus_id {
// Trigger click event
let click_event = Event::new(click_event_data.clone(), true);
self.vdom
.runtime()
.handle_event("click", click_event.clone(), id);
prevent_default |= !click_event.default_action_enabled();
stop_propagation |= !click_event.propagates();
if !prevent_default {
let mut default_event =
DomEvent::new(node_id, renderer_event.data.clone());
self.inner.as_mut().handle_event(&mut default_event);
prevent_default = true;
let element = self.inner.tree()[node_id].element_data().unwrap();
trigger_label = element.name.local == *"label";
//TODO Check for other inputs which trigger input event on click here, eg radio
let triggers_input_event = element.name.local == local_name!("input")
&& element.attr(local_name!("type")) == Some("checkbox");
if triggers_input_event {
let form_data =
wrap_event_data(self.input_event_form_data(&chain, element));
let input_event = Event::new(form_data, true);
self.vdom.runtime().handle_event("input", input_event, id);
}
}
}
//Clicking labels triggers click, and possibly input event, of bound input
if trigger_label {
if let Some((dioxus_id, node_id)) = self.label_bound_input_element(node_id)
{
let click_event = Event::new(click_event_data.clone(), true);
self.vdom.runtime().handle_event(
"click",
click_event.clone(),
dioxus_id,
);
// Handle default DOM event
if click_event.default_action_enabled() {
let DomEventData::Click(event) = &renderer_event.data else {
unreachable!();
};
let input_click_data = self
.inner
.get_node(node_id)
.unwrap()
.synthetic_click_event(event.mods);
let mut default_event = DomEvent::new(node_id, input_click_data);
self.inner.as_mut().handle_event(&mut default_event);
prevent_default = true;
// TODO: Generated click events should bubble separately
// prevent_default |= !click_event.default_action_enabled();
//TODO Check for other inputs which trigger input event on click here, eg radio
let element_data = self
.inner
.get_node(node_id)
.unwrap()
.element_data()
.unwrap();
let triggers_input_event =
element_data.attr(local_name!("type")) == Some("checkbox");
let form_data = wrap_event_data(
self.input_event_form_data(&chain, element_data),
);
if triggers_input_event {
let input_event = Event::new(form_data, true);
self.vdom.runtime().handle_event(
"input",
input_event,
dioxus_id,
);
}
}
}
}
if !event.bubbles || stop_propagation {
break;
}
}
}
DomEventData::KeyPress(kevent) => {
let key_event_data = wrap_event_data(BlitzKeyboardData(kevent.clone()));
for node_id in chain.clone().into_iter() {
let node = &self.inner.tree()[node_id];
let dioxus_id = node.element_data().and_then(DioxusDocument::dioxus_id);
println!("{} {:?}", node_id, dioxus_id);
if let Some(id) = dioxus_id {
if kevent.state.is_pressed() {
// Handle keydown event
let event = Event::new(key_event_data.clone(), true);
self.vdom
.runtime()
.handle_event("keydown", event.clone(), id);
prevent_default |= !event.default_action_enabled();
stop_propagation |= !event.propagates();
if !prevent_default && kevent.text.is_some() {
// Handle keypress event
let event = Event::new(key_event_data.clone(), true);
self.vdom
.runtime()
.handle_event("keypress", event.clone(), id);
prevent_default |= !event.default_action_enabled();
stop_propagation |= !event.propagates();
if !prevent_default {
// Handle default DOM event
let mut default_event =
DomEvent::new(node_id, renderer_event.data.clone());
self.inner.as_mut().handle_event(&mut default_event);
prevent_default = true;
// Handle input event
let element =
self.inner.tree()[node_id].element_data().unwrap();
let triggers_input_event = &element.name.local == "input"
&& matches!(
element.attr(local_name!("type")),
None | Some("text" | "password" | "email" | "search")
);
if triggers_input_event {
let form_data = wrap_event_data(dbg!(
self.input_event_form_data(&chain, element)
));
let input_event = Event::new(form_data, true);
self.vdom.runtime().handle_event("input", input_event, id);
}
}
}
} else {
// Handle keyup event
let event = Event::new(key_event_data.clone(), true);
self.vdom.runtime().handle_event("keyup", event.clone(), id);
prevent_default |= !event.default_action_enabled();
stop_propagation |= !event.propagates();
}
}
if !event.bubbles || stop_propagation {
break;
}
}
}
DomEventData::Hover => {}
// TODO: Implement IME and Hover events handling
DomEventData::Ime(_) => {}
}
if !event.cancelable || !prevent_default {
self.inner.as_mut().handle_event(event);
}
}
}
fn wrap_event_data<T: Any>(value: T) -> Rc<dyn Any> {
Rc::new(PlatformEventData::new(Box::new(value)))
}
impl DioxusDocument {
/// Generate the FormData from an input event
/// Currently only cares about input checkboxes
pub fn input_event_form_data(
&self,
parent_chain: &[usize],
element_node_data: &ElementNodeData,
) -> NativeFormData {
let parent_form = parent_chain.iter().find_map(|id| {
let node = self.inner.get_node(*id)?;
let element_data = node.element_data()?;
if element_data.name.local == local_name!("form") {
Some(node)
} else {
None
}
});
let values = if let Some(parent_form) = parent_form {
let mut values = HashMap::<String, FormValue>::new();
for form_input in self.input_descendents(parent_form).into_iter() {
// Match html behaviour here. To be included in values:
// - input must have a name
// - if its an input, we only include it if checked
// - if value is not specified, it defaults to 'on'
if let Some(name) = form_input.attr(local_name!("name")) {
if form_input.attr(local_name!("type")) == Some("checkbox")
&& form_input
.element_data()
.and_then(|data| data.checkbox_input_checked())
.unwrap_or(false)
{
let value = form_input
.attr(local_name!("value"))
.unwrap_or("on")
.to_string();
values.insert(name.to_string(), FormValue(vec![value]));
}
}
}
values
} else {
Default::default()
};
let value = match &element_node_data.node_specific_data {
NodeSpecificData::CheckboxInput(checked) => checked.to_string(),
NodeSpecificData::TextInput(input_data) => input_data.editor.text().to_string(),
_ => element_node_data
.attr(local_name!("value"))
.unwrap_or_default()
.to_string(),
};
NativeFormData { value, values }
}
/// Collect all the inputs which are descendents of a given node
fn input_descendents(&self, node: &Node) -> Vec<&Node> {
node.children
.iter()
.flat_map(|id| {
let mut res = Vec::<&Node>::new();
let Some(n) = self.inner.get_node(*id) else {
return res;
};
let Some(element_data) = n.element_data() else {
return res;
};
if element_data.name.local == local_name!("input") {
res.push(n);
}
res.extend(self.input_descendents(n).iter());
res
})
.collect()
}
pub fn new(
vdom: VirtualDom,
net_provider: Option<Arc<dyn NetProvider<Data = Resource>>>,
) -> Self {
let viewport = Viewport::new(0, 0, 1.0, ColorScheme::Light);
let mut doc = BaseDocument::new(viewport);
// Set net provider
if let Some(net_provider) = net_provider {
doc.set_net_provider(net_provider);
}
// Create a virtual "html" element to act as the root element, as we won't necessarily
// have a single root otherwise, while the rest of blitz requires that we do
let html_element_id = doc.create_node(NodeData::Element(ElementNodeData::new(
qual_name("html", None),
Vec::new(),
)));
let root_node_id = doc.root_node().id;
let html_element = doc.get_node_mut(html_element_id).unwrap();
html_element.parent = Some(root_node_id);
let root_node = doc.get_node_mut(root_node_id).unwrap();
root_node.children.push(html_element_id);
// Create the body element
let body_element_id = doc.create_node(NodeData::Element(ElementNodeData::new(
qual_name("body", None),
Vec::new(),
)));
let html_element = doc.get_node_mut(html_element_id).unwrap();
html_element.children.push(body_element_id);
let body_element = doc.get_node_mut(body_element_id).unwrap();
body_element.parent = Some(html_element_id);
// Create another virtual element to hold the root <div id="main"></div> under the html element
let main_element_id = doc.create_node(NodeData::Element(ElementNodeData::new(
qual_name("div", Some("id")),
vec![blitz_dom::node::Attribute {
name: qual_name("id", None),
value: "main".to_string(),
}],
)));
let body_element = doc.get_node_mut(body_element_id).unwrap();
body_element.children.push(main_element_id);
let main_element = doc.get_node_mut(main_element_id).unwrap();
main_element.parent = Some(body_element_id);
// Create the head element
let head_element_id = doc.create_node(NodeData::Element(ElementNodeData::new(
qual_name("head", None),
Vec::new(),
)));
let head_element = doc.get_node_mut(head_element_id).unwrap();
head_element.parent = Some(html_element_id);
let html_element = doc.get_node_mut(html_element_id).unwrap();
html_element.children.push(head_element_id);
// Include default and user-specified stylesheets
doc.add_user_agent_stylesheet(DEFAULT_CSS);
let state = DioxusState::create(&mut doc, main_element_id);
let mut doc = Self {
vdom,
vdom_state: state,
inner: doc,
html_element_id,
head_element_id,
body_element_id,
main_element_id,
};
doc.inner.set_base_url("dioxus://index.html");
// doc.initial_build();
// doc.inner.print_tree();
doc
}
pub fn initial_build(&mut self) {
// let mut writer = MutationWriter::new(&mut self.inner, &mut self.vdom_state);
// self.vdom.rebuild(&mut writer);
// dbg!(self.vdom.rebuild_to_vec());
// std::process::exit(0);
// dbg!(writer.state);
}
pub fn label_bound_input_element(&self, label_node_id: NodeId) -> Option<(ElementId, NodeId)> {
let bound_input_elements = self.inner.label_bound_input_elements(label_node_id);
// Filter down bound elements to those which have dioxus id
bound_input_elements.into_iter().find_map(|n| {
let target_element_data = n.element_data()?;
let node_id = n.id;
let dioxus_id = DioxusDocument::dioxus_id(target_element_data)?;
Some((dioxus_id, node_id))
})
}
fn dioxus_id(element_node_data: &ElementNodeData) -> Option<ElementId> {
Some(ElementId(
element_node_data
.attrs
.iter()
.find(|attr| *attr.name.local == *"data-dioxus-id")?
.value
.parse::<usize>()
.ok()?,
))
}
pub fn create_head_element(
&mut self,
name: &str,
attributes: &[(String, String)],
contents: &Option<String>,
) {
let mut stylesheet = None;
let mut title = None;
if name == "link" {
let is_stylesheet = attributes
.iter()
.any(|(name, value)| name == "rel" && value == "stylesheet");
if is_stylesheet {
stylesheet = attributes
.iter()
.find(|(name, _value)| name == "href")
.map(|(_name, value)| value.clone());
}
}
if name == "title" {
title = attributes
.iter()
.find(|(name, _value)| name == "text")
.and_then(|(_name, _value)| contents.clone());
}
let attributes = attributes
.iter()
.map(|(name, value)| Attribute {
name: qual_name(name, None),
value: value.clone(),
})
.collect();
let new_element = self
.inner
.create_node(NodeData::Element(ElementNodeData::new(
qual_name(name, None),
attributes,
)));
if let Some(contents) = contents {
let text_node = self.inner.create_text_node(contents);
self.inner
.get_node_mut(new_element)
.unwrap()
.children
.push(text_node);
}
self.inner
.get_node_mut(self.head_element_id)
.unwrap()
.children
.push(new_element);
if let Some(url) = stylesheet {
crate::assets::fetch_linked_stylesheet(&self.inner, new_element, url);
}
if let Some(_title) = title {
println!("todo: set title");
}
}
// pub fn apply_mutations(&mut self) {
// // Apply the mutations to the actual dom
// let mut writer = MutationWriter {
// doc: &mut self.inner,
// state: &mut self.vdom_state,
// };
// self.vdom.render_immediate(&mut writer);
// println!("APPLY MUTATIONS");
// self.inner.print_tree();
// }
}
+23
View File
@@ -0,0 +1,23 @@
use winit::window::WindowId;
/// Dioxus-native specific event type
pub enum DioxusNativeEvent {
/// A hotreload event, basically telling us to update our templates.
#[cfg(all(
feature = "hot-reload",
debug_assertions,
not(target_os = "android"),
not(target_os = "ios")
))]
DevserverEvent(dioxus_devtools::DevserverMsg),
/// Create a new head element from the Link and Title elements
///
/// todo(jon): these should probabkly be synchronous somehow
CreateHeadElement {
window: WindowId,
name: String,
attributes: Vec<(String, String)>,
contents: Option<String>,
},
}
+220
View File
@@ -0,0 +1,220 @@
use blitz_traits::{BlitzKeyEvent, BlitzMouseButtonEvent, MouseEventButton};
use dioxus_html::{
geometry::{ClientPoint, ElementPoint, PagePoint, ScreenPoint},
input_data::{MouseButton, MouseButtonSet},
point_interaction::{
InteractionElementOffset, InteractionLocation, ModifiersInteraction, PointerInteraction,
},
AnimationData, ClipboardData, CompositionData, DragData, FocusData, FormData, FormValue,
HasFileData, HasFormData, HasMouseData, HtmlEventConverter, ImageData, KeyboardData, MediaData,
MountedData, MouseData, PlatformEventData, PointerData, ResizeData, ScrollData, SelectionData,
ToggleData, TouchData, TransitionData, VisibleData, WheelData,
};
use dioxus_html::{HasFocusData, HasKeyboardData};
use keyboard_types::{Code, Key, Location, Modifiers};
use std::any::Any;
use std::collections::HashMap;
pub struct NativeConverter {}
impl HtmlEventConverter for NativeConverter {
fn convert_form_data(&self, event: &PlatformEventData) -> FormData {
event.downcast::<NativeFormData>().unwrap().clone().into()
}
fn convert_mouse_data(&self, event: &PlatformEventData) -> MouseData {
event.downcast::<NativeClickData>().unwrap().clone().into()
}
fn convert_keyboard_data(&self, event: &PlatformEventData) -> KeyboardData {
event
.downcast::<BlitzKeyboardData>()
.unwrap()
.clone()
.into()
}
fn convert_focus_data(&self, _event: &PlatformEventData) -> FocusData {
NativeFocusData {}.into()
}
fn convert_animation_data(&self, _event: &PlatformEventData) -> AnimationData {
todo!("todo: convert_animation_data in dioxus-native. requires support in blitz")
}
fn convert_clipboard_data(&self, _event: &PlatformEventData) -> ClipboardData {
todo!("todo: convert_clipboard_data in dioxus-native. requires support in blitz")
}
fn convert_composition_data(&self, _event: &PlatformEventData) -> CompositionData {
todo!("todo: convert_composition_data in dioxus-native. requires support in blitz")
}
fn convert_drag_data(&self, _event: &PlatformEventData) -> DragData {
todo!("todo: convert_drag_data in dioxus-native. requires support in blitz")
}
fn convert_image_data(&self, _event: &PlatformEventData) -> ImageData {
todo!("todo: convert_image_data in dioxus-native. requires support in blitz")
}
fn convert_media_data(&self, _event: &PlatformEventData) -> MediaData {
todo!("todo: convert_media_data in dioxus-native. requires support in blitz")
}
fn convert_mounted_data(&self, _event: &PlatformEventData) -> MountedData {
todo!("todo: convert_mounted_data in dioxus-native. requires support in blitz")
}
fn convert_pointer_data(&self, _event: &PlatformEventData) -> PointerData {
todo!("todo: convert_pointer_data in dioxus-native. requires support in blitz")
}
fn convert_scroll_data(&self, _event: &PlatformEventData) -> ScrollData {
todo!("todo: convert_scroll_data in dioxus-native. requires support in blitz")
}
fn convert_selection_data(&self, _event: &PlatformEventData) -> SelectionData {
todo!("todo: convert_selection_data in dioxus-native. requires support in blitz")
}
fn convert_toggle_data(&self, _event: &PlatformEventData) -> ToggleData {
todo!("todo: convert_toggle_data in dioxus-native. requires support in blitz")
}
fn convert_touch_data(&self, _event: &PlatformEventData) -> TouchData {
todo!("todo: convert_touch_data in dioxus-native. requires support in blitz")
}
fn convert_transition_data(&self, _event: &PlatformEventData) -> TransitionData {
todo!("todo: convert_transition_data in dioxus-native. requires support in blitz")
}
fn convert_wheel_data(&self, _event: &PlatformEventData) -> WheelData {
todo!("todo: convert_wheel_data in dioxus-native. requires support in blitz")
}
fn convert_resize_data(&self, _event: &PlatformEventData) -> ResizeData {
todo!("todo: convert_resize_data in dioxus-native. requires support in blitz")
}
fn convert_visible_data(&self, _event: &PlatformEventData) -> VisibleData {
todo!("todo: convert_visible_data in dioxus-native. requires support in blitz")
}
}
#[derive(Clone, Debug)]
pub struct NativeFormData {
pub value: String,
pub values: HashMap<String, FormValue>,
}
impl HasFormData for NativeFormData {
fn as_any(&self) -> &dyn std::any::Any {
self as &dyn std::any::Any
}
fn value(&self) -> String {
self.value.clone()
}
fn values(&self) -> HashMap<String, FormValue> {
self.values.clone()
}
}
impl HasFileData for NativeFormData {}
#[derive(Clone, Debug)]
pub(crate) struct BlitzKeyboardData(pub(crate) BlitzKeyEvent);
impl ModifiersInteraction for BlitzKeyboardData {
fn modifiers(&self) -> Modifiers {
self.0.modifiers
}
}
impl HasKeyboardData for BlitzKeyboardData {
fn key(&self) -> Key {
self.0.key.clone()
}
fn code(&self) -> Code {
self.0.code
}
fn location(&self) -> Location {
self.0.location
}
fn is_auto_repeating(&self) -> bool {
self.0.is_auto_repeating
}
fn is_composing(&self) -> bool {
self.0.is_composing
}
fn as_any(&self) -> &dyn std::any::Any {
self as &dyn Any
}
}
#[derive(Clone)]
pub struct NativeClickData(pub(crate) BlitzMouseButtonEvent);
impl InteractionLocation for NativeClickData {
fn client_coordinates(&self) -> ClientPoint {
ClientPoint::new(self.0.x as _, self.0.y as _)
}
// these require blitz to pass them along, or a dom rect
fn screen_coordinates(&self) -> ScreenPoint {
unimplemented!()
}
fn page_coordinates(&self) -> PagePoint {
unimplemented!()
}
}
impl InteractionElementOffset for NativeClickData {
fn element_coordinates(&self) -> ElementPoint {
todo!()
}
}
impl ModifiersInteraction for NativeClickData {
fn modifiers(&self) -> Modifiers {
self.0.mods
}
}
impl PointerInteraction for NativeClickData {
fn trigger_button(&self) -> Option<MouseButton> {
Some(match self.0.button {
MouseEventButton::Main => MouseButton::Primary,
MouseEventButton::Auxiliary => MouseButton::Auxiliary,
MouseEventButton::Secondary => MouseButton::Secondary,
MouseEventButton::Fourth => MouseButton::Fourth,
MouseEventButton::Fifth => MouseButton::Fifth,
})
}
fn held_buttons(&self) -> MouseButtonSet {
dioxus_html::input_data::decode_mouse_button_set(self.0.buttons.bits() as u16)
}
}
impl HasMouseData for NativeClickData {
fn as_any(&self) -> &dyn std::any::Any {
self as &dyn std::any::Any
}
}
#[derive(Clone)]
pub struct NativeFocusData {}
impl HasFocusData for NativeFocusData {
fn as_any(&self) -> &dyn std::any::Any {
self as &dyn std::any::Any
}
}
+96
View File
@@ -0,0 +1,96 @@
#![cfg_attr(docsrs, feature(doc_cfg))]
//! A native renderer for Dioxus.
//!
//! ## Feature flags
//! - `default`: Enables the features listed below.
//! - `accessibility`: Enables [`accesskit`] accessibility support.
//! - `hot-reload`: Enables hot-reloading of Dioxus RSX.
//! - `menu`: Enables the [`muda`] menubar.
//! - `tracing`: Enables tracing support.
mod assets;
mod contexts;
mod dioxus_application;
mod dioxus_document;
mod event;
mod event_handler;
mod mutation_writer;
pub use dioxus_application::DioxusNativeApplication;
pub use dioxus_document::DioxusDocument;
pub use event::DioxusNativeEvent;
use blitz_shell::{create_default_event_loop, BlitzShellEvent, Config, WindowConfig};
use dioxus_core::{ComponentFunction, Element, VirtualDom};
use std::any::Any;
type NodeId = usize;
/// Launch an interactive HTML/CSS renderer driven by the Dioxus virtualdom
pub fn launch(app: fn() -> Element) {
launch_cfg(app, vec![], vec![])
}
pub fn launch_cfg(
app: fn() -> Element,
contexts: Vec<Box<dyn Fn() -> Box<dyn Any> + Send + Sync>>,
cfg: Vec<Box<dyn Any>>,
) {
launch_cfg_with_props(app, (), contexts, cfg)
}
// todo: props shouldn't have the clone bound - should try and match dioxus-desktop behavior
pub fn launch_cfg_with_props<P: Clone + 'static, M: 'static>(
app: impl ComponentFunction<P, M>,
props: P,
contexts: Vec<Box<dyn Fn() -> Box<dyn Any> + Send + Sync>>,
_cfg: Vec<Box<dyn Any>>,
) {
let _cfg = _cfg
.into_iter()
.find_map(|cfg| cfg.downcast::<Config>().ok())
.unwrap_or_default();
let event_loop = create_default_event_loop::<BlitzShellEvent>();
// Turn on the runtime and enter it
let rt = tokio::runtime::Builder::new_multi_thread()
.enable_all()
.build()
.unwrap();
let _guard = rt.enter();
// Setup hot-reloading if enabled.
#[cfg(all(
feature = "hot-reload",
debug_assertions,
not(target_os = "android"),
not(target_os = "ios")
))]
{
use crate::event::DioxusNativeEvent;
if let Some(endpoint) = dioxus_cli_config::devserver_ws_endpoint() {
let proxy = event_loop.create_proxy();
dioxus_devtools::connect(endpoint, move |event| {
let dxn_event = DioxusNativeEvent::DevserverEvent(event);
let _ = proxy.send_event(BlitzShellEvent::embedder_event(dxn_event));
})
}
}
// Spin up the virtualdom
// We're going to need to hit it with a special waker
// Note that we are delaying the initialization of window-specific contexts (net provider, document, etc)
let mut vdom = VirtualDom::new_with_props(app, props);
// Add contexts
for context in contexts {
vdom.insert_any_root_context(context());
}
// Create application
let mut application = DioxusNativeApplication::new(event_loop.create_proxy(), vdom);
// Run event loop
event_loop.run_app(&mut application).unwrap();
}
+575
View File
@@ -0,0 +1,575 @@
use crate::{dioxus_document::qual_name, NodeId};
use blitz_dom::{
local_name, namespace_url,
node::{Attribute, NodeSpecificData},
ns, BaseDocument, ElementNodeData, NodeData, QualName, RestyleHint,
};
use dioxus_core::{
AttributeValue, ElementId, Template, TemplateAttribute, TemplateNode, WriteMutations,
};
use rustc_hash::FxHashMap;
use std::collections::HashSet;
/// The state of the Dioxus integration with the RealDom
#[derive(Debug)]
pub struct DioxusState {
/// Store of templates keyed by unique name
templates: FxHashMap<Template, Vec<NodeId>>,
/// Stack machine state for applying dioxus mutations
stack: Vec<NodeId>,
/// Mapping from vdom ElementId -> rdom NodeId
node_id_mapping: Vec<Option<NodeId>>,
}
/// A writer for mutations that can be used with the RealDom.
pub struct MutationWriter<'a> {
/// The realdom associated with this writer
pub doc: &'a mut BaseDocument,
/// The state associated with this writer
pub state: &'a mut DioxusState,
pub style_nodes: HashSet<usize>,
/// The (latest) node which has been mounted in and had autofocus=true, if any
#[cfg(feature = "autofocus")]
pub node_to_autofocus: Option<usize>,
}
impl<'a> MutationWriter<'a> {
pub fn new(doc: &'a mut BaseDocument, state: &'a mut DioxusState) -> Self {
MutationWriter {
doc,
state,
style_nodes: HashSet::new(),
#[cfg(feature = "autofocus")]
node_to_autofocus: None,
}
}
fn is_style_node(&self, node_id: NodeId) -> bool {
self.doc
.get_node(node_id)
.unwrap()
.data
.is_element_with_tag_name(&local_name!("style"))
}
fn maybe_push_style_node(&mut self, node_id: impl Into<Option<NodeId>>) {
if let Some(node_id) = node_id.into() {
if self.is_style_node(node_id) {
self.style_nodes.insert(node_id);
}
}
}
#[track_caller]
fn maybe_push_parent_style_node(&mut self, node_id: NodeId) {
let parent_id = self.doc.get_node(node_id).unwrap().parent;
self.maybe_push_style_node(parent_id);
}
}
impl Drop for MutationWriter<'_> {
fn drop(&mut self) {
// Add/Update inline stylesheets (<style> elements)
for &id in &self.style_nodes {
self.doc.upsert_stylesheet_for_node(id);
}
#[cfg(feature = "autofocus")]
if let Some(node_id) = self.node_to_autofocus {
if self.doc.get_node(node_id).is_some() {
self.doc.set_focus_to(node_id);
}
}
}
}
impl DioxusState {
/// Initialize the DioxusState in the RealDom
pub fn create(_doc: &mut BaseDocument, mount_node: NodeId) -> Self {
Self {
templates: FxHashMap::default(),
stack: vec![mount_node],
node_id_mapping: vec![Some(mount_node)],
}
}
/// Convert an ElementId to a NodeId
pub fn element_to_node_id(&self, element_id: ElementId) -> NodeId {
self.try_element_to_node_id(element_id).unwrap()
}
/// Attempt to convert an ElementId to a NodeId. This will return None if the ElementId is not in the RealDom.
pub fn try_element_to_node_id(&self, element_id: ElementId) -> Option<NodeId> {
self.node_id_mapping.get(element_id.0).copied().flatten()
}
}
impl MutationWriter<'_> {
/// Update an ElementId -> NodeId mapping
fn set_id_mapping(&mut self, node_id: NodeId, element_id: ElementId) {
let element_id: usize = element_id.0;
// Ensure node_id_mapping is large enough to contain element_id
if self.state.node_id_mapping.len() <= element_id {
self.state.node_id_mapping.resize(element_id + 1, None);
}
// Set the new mapping
self.state.node_id_mapping[element_id] = Some(node_id);
}
/// Find a child in the document by child index path
fn load_child(&self, path: &[u8]) -> NodeId {
let mut current = self
.doc
.get_node(*self.state.stack.last().unwrap())
.unwrap();
for i in path {
let new_id = current.children[*i as usize];
current = self.doc.get_node(new_id).unwrap();
}
current.id
}
fn create_template_node(&mut self, node: &TemplateNode) -> NodeId {
match node {
TemplateNode::Element {
tag,
namespace,
attrs,
children,
} => {
let name = qual_name(tag, *namespace);
let attrs = attrs
.iter()
.filter_map(|attr| match attr {
TemplateAttribute::Static {
name,
value,
namespace,
} => Some(Attribute {
name: qual_name(name, *namespace),
value: value.to_string(),
}),
TemplateAttribute::Dynamic { .. } => None,
})
.collect();
let mut data = ElementNodeData::new(name, attrs);
data.flush_style_attribute(self.doc.guard());
let child_ids: Vec<NodeId> = children
.iter()
.map(|child| self.create_template_node(child))
.collect();
let id = self.doc.create_node(NodeData::Element(data));
let node = self.doc.get_node(id).unwrap();
// Initialise style data
*node.stylo_element_data.borrow_mut() = Some(Default::default());
if let Some(src_attr) = node.attr(local_name!("src")) {
crate::assets::fetch_image(self.doc, id, src_attr.to_string());
}
let rel_attr = node.attr(local_name!("rel"));
let href_attr = node.attr(local_name!("href"));
if let (Some("stylesheet"), Some(href)) = (rel_attr, href_attr) {
crate::assets::fetch_linked_stylesheet(self.doc, id, href.to_string());
}
// If the node has an "id" attribute, store it in the ID map.
if let Some(id_attr) = node.attr(local_name!("id")) {
self.doc.nodes_to_id.insert(id_attr.to_string(), id);
}
for &child_id in &child_ids {
self.doc.get_node_mut(child_id).unwrap().parent = Some(id);
}
self.doc.get_node_mut(id).unwrap().children = child_ids;
id
}
TemplateNode::Text { text } => self.doc.create_text_node(text),
TemplateNode::Dynamic { .. } => self.doc.create_node(NodeData::Comment),
}
}
}
impl WriteMutations for MutationWriter<'_> {
fn append_children(&mut self, id: ElementId, m: usize) {
#[cfg(feature = "tracing")]
tracing::info!("append_children id:{} m:{}", id.0, m);
let children = self.state.stack.split_off(self.state.stack.len() - m);
let parent = self.state.element_to_node_id(id);
for child in children {
self.doc.get_node_mut(parent).unwrap().children.push(child);
self.doc.get_node_mut(child).unwrap().parent = Some(parent);
}
self.maybe_push_style_node(parent);
}
fn assign_node_id(&mut self, path: &'static [u8], id: ElementId) {
#[cfg(feature = "tracing")]
tracing::info!("assign_node_id path:{:?} id:{}", path, id.0);
// If there is an existing node already mapped to that ID and
// it has no parent, then drop it
if let Some(node_id) = self.state.try_element_to_node_id(id) {
if let Some(node) = self.doc.get_node(node_id) {
if node.parent.is_none() {
self.doc.remove_and_drop_node(node_id);
}
}
}
let node_id = self.load_child(path);
self.set_id_mapping(node_id, id);
}
fn create_placeholder(&mut self, id: ElementId) {
#[cfg(feature = "tracing")]
tracing::info!("create_placeholder id:{}", id.0);
let node_id = self.doc.create_node(NodeData::Comment);
self.set_id_mapping(node_id, id);
self.state.stack.push(node_id);
}
fn create_text_node(&mut self, value: &str, id: ElementId) {
#[cfg(feature = "tracing")]
tracing::info!("create_text_node id:{} text:{}", id.0, value);
let node_id = self.doc.create_text_node(value);
self.set_id_mapping(node_id, id);
self.state.stack.push(node_id);
}
#[allow(clippy::map_entry)]
fn load_template(&mut self, template: Template, index: usize, id: ElementId) {
if !self.state.templates.contains_key(&template) {
let template_root_ids: Vec<NodeId> = template
.roots
.iter()
.map(|root| self.create_template_node(root))
.collect();
self.state.templates.insert(template, template_root_ids);
}
let template_entry = &self.state.templates[&template];
let template_node_id = template_entry[index];
let clone_id = self.doc.deep_clone_node(template_node_id);
#[cfg(feature = "autofocus")]
autofocus_node_recursive(self.doc, &mut self.node_to_autofocus, clone_id);
self.set_id_mapping(clone_id, id);
self.state.stack.push(clone_id);
}
fn replace_node_with(&mut self, id: ElementId, m: usize) {
#[cfg(feature = "tracing")]
tracing::info!("replace_node_with id:{} m:{}", id.0, m);
let new_nodes = self.state.stack.split_off(self.state.stack.len() - m);
let anchor_node_id = self.state.element_to_node_id(id);
self.maybe_push_parent_style_node(anchor_node_id);
self.doc.insert_before(anchor_node_id, &new_nodes);
self.doc.remove_node(anchor_node_id);
}
fn replace_placeholder_with_nodes(&mut self, path: &'static [u8], m: usize) {
#[cfg(feature = "tracing")]
tracing::info!("replace_placeholder_with_nodes path:{:?} m:{}", path, m);
let new_nodes = self.state.stack.split_off(self.state.stack.len() - m);
let anchor_node_id = self.load_child(path);
self.maybe_push_parent_style_node(anchor_node_id);
self.doc.insert_before(anchor_node_id, &new_nodes);
self.doc.remove_node(anchor_node_id);
}
fn insert_nodes_after(&mut self, id: ElementId, m: usize) {
#[cfg(feature = "tracing")]
tracing::info!("insert_nodes_after id:{} m:{}", id.0, m);
let new_nodes = self.state.stack.split_off(self.state.stack.len() - m);
let anchor_node_id = self.state.element_to_node_id(id);
let next_sibling_id = self
.doc
.get_node(anchor_node_id)
.unwrap()
.forward(1)
.map(|node| node.id);
match next_sibling_id {
Some(anchor_node_id) => {
self.doc.insert_before(anchor_node_id, &new_nodes);
}
None => self.doc.append(anchor_node_id, &new_nodes),
}
self.maybe_push_parent_style_node(anchor_node_id);
}
fn insert_nodes_before(&mut self, id: ElementId, m: usize) {
#[cfg(feature = "tracing")]
tracing::info!("insert_nodes_before id:{} m:{}", id.0, m);
let new_nodes = self.state.stack.split_off(self.state.stack.len() - m);
let anchor_node_id = self.state.element_to_node_id(id);
self.doc.insert_before(anchor_node_id, &new_nodes);
self.maybe_push_parent_style_node(anchor_node_id);
}
fn set_attribute(
&mut self,
name: &'static str,
ns: Option<&'static str>,
value: &AttributeValue,
id: ElementId,
) {
let node_id = self.state.element_to_node_id(id);
#[cfg(feature = "tracing")]
tracing::info!(
"set_attribute node_id:{} ns: {:?} name:{}, value:{:?}",
node_id,
ns,
name,
value
);
self.doc.snapshot_node(node_id);
let mut queued_image = None;
let mut queued_stylesheet = None;
{
let node = &mut self.doc.nodes[node_id];
let stylo_element_data = &mut *node.stylo_element_data.borrow_mut();
if let Some(data) = stylo_element_data {
data.hint |= RestyleHint::restyle_subtree();
}
if let NodeData::Element(ref mut element) = node.data {
if element.name.local == local_name!("input") && name == "checked" {
set_input_checked_state(element, value);
}
// FIXME: support other non-text attributes
else if let AttributeValue::Text(val) = value {
if name == "value" {
// Update text input value
if let Some(input_data) = element.text_input_data_mut() {
input_data.set_text(
&mut self.doc.font_ctx,
&mut self.doc.layout_ctx,
val,
);
}
}
// FIXME check namespace
let existing_attr = element
.attrs
.iter_mut()
.find(|attr| attr.name.local == *name);
if let Some(existing_attr) = existing_attr {
existing_attr.value.clear();
existing_attr.value.push_str(val);
} else {
// we have overloaded the style namespace to accumulate style attributes without a `style` block
if ns == Some("style") {
// todo: need to accumulate style attributes into a single style
//
// element.
} else {
element.attrs.push(Attribute {
name: qual_name(name, ns),
value: val.to_string(),
});
}
}
if name == "style" {
element.flush_style_attribute(&self.doc.guard);
}
if name == "src" && !val.is_empty() {
element.node_specific_data = NodeSpecificData::None;
queued_image = Some(val.to_string());
}
if element.name.local == local_name!("link")
&& name == "href"
&& !val.is_empty()
{
queued_stylesheet = Some(val.to_string());
}
}
if let AttributeValue::None = value {
// Update text input value
if name == "value" {
if let Some(input_data) = element.text_input_data_mut() {
input_data.set_text(
&mut self.doc.font_ctx,
&mut self.doc.layout_ctx,
"",
);
}
}
// FIXME: check namespace
element.attrs.retain(|attr| attr.name.local != *name);
}
}
}
if let Some(queued_image) = queued_image {
crate::assets::fetch_image(self.doc, node_id, queued_image);
}
if let Some(queued_stylesheet) = queued_stylesheet {
crate::assets::fetch_linked_stylesheet(self.doc, node_id, queued_stylesheet);
}
}
fn set_node_text(&mut self, value: &str, id: ElementId) {
#[cfg(feature = "tracing")]
tracing::info!("set_node_text id:{} value:{}", id.0, value);
let node_id = self.state.element_to_node_id(id);
let node = self.doc.get_node_mut(node_id).unwrap();
let text = match node.data {
NodeData::Text(ref mut text) => text,
// todo: otherwise this is basically element.textContent which is a bit different - need to parse as html
_ => return,
};
let changed = text.content != value;
if changed {
text.content.clear();
text.content.push_str(value);
let parent = node.parent;
self.maybe_push_style_node(parent);
}
}
fn create_event_listener(&mut self, _name: &'static str, _id: ElementId) {
// we're going to actually set the listener here as a placeholder - in JS this would also be a placeholder
// we might actually just want to attach the attribute to the root element (delegation)
self.set_attribute(
_name,
None,
&AttributeValue::Text("<rust func>".into()),
_id,
);
// also set the data-dioxus-id attribute so we can find the element later
self.set_attribute(
"data-dioxus-id",
None,
&AttributeValue::Text(_id.0.to_string()),
_id,
);
// let node_id = self.state.element_to_node_id(id);
// let mut node = self.rdom.get_mut(node_id).unwrap();
// node.add_event_listener(name);
}
fn remove_event_listener(&mut self, _name: &'static str, _id: ElementId) {
// let node_id = self.state.element_to_node_id(id);
// let mut node = self.rdom.get_mut(node_id).unwrap();
// node.remove_event_listener(name);
}
fn remove_node(&mut self, id: ElementId) {
#[cfg(feature = "tracing")]
tracing::info!("remove_node id:{}", id.0);
let node_id = self.state.element_to_node_id(id);
self.doc.remove_node(node_id);
}
fn push_root(&mut self, id: ElementId) {
#[cfg(feature = "tracing")]
tracing::info!("push_root id:{}", id.0,);
let node_id = self.state.element_to_node_id(id);
self.state.stack.push(node_id);
}
}
/// Set 'checked' state on an input based on given attributevalue
fn set_input_checked_state(element: &mut ElementNodeData, value: &AttributeValue) {
let checked: bool;
match value {
AttributeValue::Bool(checked_bool) => {
checked = *checked_bool;
}
AttributeValue::Text(val) => {
if let Ok(checked_bool) = val.parse() {
checked = checked_bool;
} else {
return;
};
}
_ => {
return;
}
};
match element.node_specific_data {
NodeSpecificData::CheckboxInput(ref mut checked_mut) => *checked_mut = checked,
// If we have just constructed the element, set the node attribute,
// and NodeSpecificData will be created from that later
// this simulates the checked attribute being set in html,
// and the element's checked property being set from that
NodeSpecificData::None => element.attrs.push(Attribute {
name: QualName {
prefix: None,
ns: ns!(html),
local: local_name!("checked"),
},
value: checked.to_string(),
}),
_ => {}
}
}
#[cfg(feature = "autofocus")]
fn autofocus_node_recursive(
doc: &BaseDocument,
node_to_autofocus: &mut Option<usize>,
node_id: usize,
) {
if let Some(node) = doc.get_node(node_id) {
if node.is_focussable() {
if let NodeData::Element(ref element) = node.data {
if let Some(value) = element.attr(local_name!("autofocus")) {
if value == "true" {
*node_to_autofocus = Some(node_id);
}
}
}
}
for child_node_id in &node.children {
autofocus_node_recursive(doc, node_to_autofocus, *child_node_id);
}
}
}
@@ -3,6 +3,8 @@ use dioxus::prelude::*;
use nested_suspense::app;
fn main() {
dioxus::logger::init(dioxus::logger::tracing::Level::TRACE).expect("logger failed to init");
dioxus::LaunchBuilder::new()
.with_cfg(server_only! {
ServeConfig::builder()
@@ -15,6 +17,7 @@ fn main() {
.unwrap()
.join("public")
)
.clear_cache(false)
)
.enable_out_of_order_streaming()
})
+3 -3
View File
@@ -15,10 +15,10 @@ dioxus-history = { workspace = true }
dioxus-router-macro = { workspace = true }
dioxus-fullstack-hooks = { workspace = true, optional = true }
tracing = { workspace = true }
urlencoding = "2.1.3"
url = "2.3.1"
urlencoding = { workspace = true }
url = { workspace = true }
dioxus-cli-config = { workspace = true }
rustversion = "1.0.17"
rustversion = { workspace = true }
[features]
default = []