swaits/dioxus
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'upstream' into return-from-js

Browse Source
This commit is contained in:
Evan Almloff committed 2022-12-08 11:25:15 -06:00
2 parents 35bebbf0cb cdb1e76f6f
commit bf47f64852
281 files changed
+16169 -19328
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

examples/all_css.rs
+401 -399
View File
@@ -7,405 +7,407 @@ fn main() {
fn app(cx: Scope) -> Element {
cx.render(rsx! {
div {
align_content: "a",
align_items: "a",
align_self: "a",
alignment_adjust: "a",
alignment_baseline: "a",
all: "a",
alt: "a",
animation: "a",
animation_delay: "a",
animation_direction: "a",
animation_duration: "a",
animation_fill_mode: "a",
animation_iteration_count: "a",
animation_name: "a",
animation_play_state: "a",
animation_timing_function: "a",
azimuth: "a",
backface_visibility: "a",
background: "a",
background_attachment: "a",
background_clip: "a",
background_color: "a",
background_image: "a",
background_origin: "a",
background_position: "a",
background_repeat: "a",
background_size: "a",
background_blend_mode: "a",
baseline_shift: "a",
bleed: "a",
bookmark_label: "a",
bookmark_level: "a",
bookmark_state: "a",
border: "a",
border_color: "a",
border_style: "a",
border_width: "a",
border_bottom: "a",
border_bottom_color: "a",
border_bottom_style: "a",
border_bottom_width: "a",
border_left: "a",
border_left_color: "a",
border_left_style: "a",
border_left_width: "a",
border_right: "a",
border_right_color: "a",
border_right_style: "a",
border_right_width: "a",
border_top: "a",
border_top_color: "a",
border_top_style: "a",
border_top_width: "a",
border_collapse: "a",
border_image: "a",
border_image_outset: "a",
border_image_repeat: "a",
border_image_slice: "a",
border_image_source: "a",
border_image_width: "a",
border_radius: "a",
border_bottom_left_radius: "a",
border_bottom_right_radius: "a",
border_top_left_radius: "a",
border_top_right_radius: "a",
border_spacing: "a",
bottom: "a",
box_decoration_break: "a",
box_shadow: "a",
box_sizing: "a",
box_snap: "a",
break_after: "a",
break_before: "a",
break_inside: "a",
buffered_rendering: "a",
caption_side: "a",
clear: "a",
clear_side: "a",
clip: "a",
clip_path: "a",
clip_rule: "a",
color: "a",
color_adjust: "a",
color_correction: "a",
color_interpolation: "a",
color_interpolation_filters: "a",
color_profile: "a",
color_rendering: "a",
column_fill: "a",
column_gap: "a",
column_rule: "a",
column_rule_color: "a",
column_rule_style: "a",
column_rule_width: "a",
column_span: "a",
columns: "a",
column_count: "a",
column_width: "a",
contain: "a",
content: "a",
counter_increment: "a",
counter_reset: "a",
counter_set: "a",
cue: "a",
cue_after: "a",
cue_before: "a",
cursor: "a",
direction: "a",
display: "a",
display_inside: "a",
display_outside: "a",
display_extras: "a",
display_box: "a",
dominant_baseline: "a",
elevation: "a",
empty_cells: "a",
enable_background: "a",
fill: "a",
fill_opacity: "a",
fill_rule: "a",
filter: "a",
float: "a",
float_defer_column: "a",
float_defer_page: "a",
float_offset: "a",
float_wrap: "a",
flow_into: "a",
flow_from: "a",
flex: "a",
flex_basis: "a",
flex_grow: "a",
flex_shrink: "a",
flex_flow: "a",
flex_direction: "a",
flex_wrap: "a",
flood_color: "a",
flood_opacity: "a",
font: "a",
font_family: "a",
font_size: "a",
font_stretch: "a",
font_style: "a",
font_weight: "a",
font_feature_settings: "a",
font_kerning: "a",
font_language_override: "a",
font_size_adjust: "a",
font_synthesis: "a",
font_variant: "a",
font_variant_alternates: "a",
font_variant_caps: "a",
font_variant_east_asian: "a",
font_variant_ligatures: "a",
font_variant_numeric: "a",
font_variant_position: "a",
footnote_policy: "a",
glyph_orientation_horizontal: "a",
glyph_orientation_vertical: "a",
grid: "a",
grid_auto_flow: "a",
grid_auto_columns: "a",
grid_auto_rows: "a",
grid_template: "a",
grid_template_areas: "a",
grid_template_columns: "a",
grid_template_rows: "a",
grid_area: "a",
grid_column: "a",
grid_column_start: "a",
grid_column_end: "a",
grid_row: "a",
grid_row_start: "a",
grid_row_end: "a",
hanging_punctuation: "a",
height: "a",
hyphenate_character: "a",
hyphenate_limit_chars: "a",
hyphenate_limit_last: "a",
hyphenate_limit_lines: "a",
hyphenate_limit_zone: "a",
hyphens: "a",
icon: "a",
image_orientation: "a",
image_resolution: "a",
image_rendering: "a",
ime: "a",
ime_align: "a",
ime_mode: "a",
ime_offset: "a",
ime_width: "a",
initial_letters: "a",
inline_box_align: "a",
isolation: "a",
justify_content: "a",
justify_items: "a",
justify_self: "a",
kerning: "a",
left: "a",
letter_spacing: "a",
lighting_color: "a",
line_box_contain: "a",
line_break: "a",
line_grid: "a",
line_height: "a",
line_slack: "a",
line_snap: "a",
list_style: "a",
list_style_image: "a",
list_style_position: "a",
list_style_type: "a",
margin: "a",
margin_bottom: "a",
margin_left: "a",
margin_right: "a",
margin_top: "a",
marker: "a",
marker_end: "a",
marker_mid: "a",
marker_pattern: "a",
marker_segment: "a",
marker_start: "a",
marker_knockout_left: "a",
marker_knockout_right: "a",
marker_side: "a",
marks: "a",
marquee_direction: "a",
marquee_play_count: "a",
marquee_speed: "a",
marquee_style: "a",
mask: "a",
mask_image: "a",
mask_repeat: "a",
mask_position: "a",
mask_clip: "a",
mask_origin: "a",
mask_size: "a",
mask_box: "a",
mask_box_outset: "a",
mask_box_repeat: "a",
mask_box_slice: "a",
mask_box_source: "a",
mask_box_width: "a",
mask_type: "a",
max_height: "a",
max_lines: "a",
max_width: "a",
min_height: "a",
min_width: "a",
mix_blend_mode: "a",
nav_down: "a",
nav_index: "a",
nav_left: "a",
nav_right: "a",
nav_up: "a",
object_fit: "a",
object_position: "a",
offset_after: "a",
offset_before: "a",
offset_end: "a",
offset_start: "a",
opacity: "a",
order: "a",
orphans: "a",
outline: "a",
outline_color: "a",
outline_style: "a",
outline_width: "a",
outline_offset: "a",
overflow: "a",
overflow_x: "a",
overflow_y: "a",
overflow_style: "a",
overflow_wrap: "a",
padding: "a",
padding_bottom: "a",
padding_left: "a",
padding_right: "a",
padding_top: "a",
page: "a",
page_break_after: "a",
page_break_before: "a",
page_break_inside: "a",
paint_order: "a",
pause: "a",
pause_after: "a",
pause_before: "a",
perspective: "a",
perspective_origin: "a",
pitch: "a",
pitch_range: "a",
play_during: "a",
pointer_events: "a",
position: "a",
quotes: "a",
region_fragment: "a",
resize: "a",
rest: "a",
rest_after: "a",
rest_before: "a",
richness: "a",
right: "a",
ruby_align: "a",
ruby_merge: "a",
ruby_position: "a",
scroll_behavior: "a",
scroll_snap_coordinate: "a",
scroll_snap_destination: "a",
scroll_snap_points_x: "a",
scroll_snap_points_y: "a",
scroll_snap_type: "a",
shape_image_threshold: "a",
shape_inside: "a",
shape_margin: "a",
shape_outside: "a",
shape_padding: "a",
shape_rendering: "a",
size: "a",
speak: "a",
speak_as: "a",
speak_header: "a",
speak_numeral: "a",
speak_punctuation: "a",
speech_rate: "a",
stop_color: "a",
stop_opacity: "a",
stress: "a",
string_set: "a",
stroke: "a",
stroke_dasharray: "a",
stroke_dashoffset: "a",
stroke_linecap: "a",
stroke_linejoin: "a",
stroke_miterlimit: "a",
stroke_opacity: "a",
stroke_width: "a",
tab_size: "a",
table_layout: "a",
text_align: "a",
text_align_all: "a",
text_align_last: "a",
text_anchor: "a",
text_combine_upright: "a",
text_decoration: "a",
text_decoration_color: "a",
text_decoration_line: "a",
text_decoration_style: "a",
text_decoration_skip: "a",
text_emphasis: "a",
text_emphasis_color: "a",
text_emphasis_style: "a",
text_emphasis_position: "a",
text_emphasis_skip: "a",
text_height: "a",
text_indent: "a",
text_justify: "a",
text_orientation: "a",
text_overflow: "a",
text_rendering: "a",
text_shadow: "a",
text_size_adjust: "a",
text_space_collapse: "a",
text_spacing: "a",
text_transform: "a",
text_underline_position: "a",
text_wrap: "a",
top: "a",
touch_action: "a",
transform: "a",
transform_box: "a",
transform_origin: "a",
transform_style: "a",
transition: "a",
transition_delay: "a",
transition_duration: "a",
transition_property: "a",
unicode_bidi: "a",
vector_effect: "a",
vertical_align: "a",
visibility: "a",
voice_balance: "a",
voice_duration: "a",
voice_family: "a",
voice_pitch: "a",
voice_range: "a",
voice_rate: "a",
voice_stress: "a",
voice_volumn: "a",
volume: "a",
white_space: "a",
widows: "a",
width: "a",
will_change: "a",
word_break: "a",
word_spacing: "a",
word_wrap: "a",
wrap_flow: "a",
wrap_through: "a",
writing_mode: "a",
z_index: "a",
align_content: "a",
align_items: "a",
align_self: "a",
alignment_adjust: "a",
alignment_baseline: "a",
all: "a",
alt: "a",
animation: "a",
animation_delay: "a",
animation_direction: "a",
animation_duration: "a",
animation_fill_mode: "a",
animation_iteration_count: "a",
animation_name: "a",
animation_play_state: "a",
animation_timing_function: "a",
azimuth: "a",
backface_visibility: "a",
background: "a",
background_attachment: "a",
background_clip: "a",
background_color: "a",
background_image: "a",
background_origin: "a",
background_position: "a",
background_repeat: "a",
background_size: "a",
background_blend_mode: "a",
baseline_shift: "a",
bleed: "a",
bookmark_label: "a",
bookmark_level: "a",
bookmark_state: "a",
border: "a",
border_color: "a",
border_style: "a",
border_width: "a",
border_bottom: "a",
border_bottom_color: "a",
border_bottom_style: "a",
border_bottom_width: "a",
border_left: "a",
border_left_color: "a",
border_left_style: "a",
border_left_width: "a",
border_right: "a",
border_right_color: "a",
border_right_style: "a",
border_right_width: "a",
border_top: "a",
border_top_color: "a",
border_top_style: "a",
border_top_width: "a",
border_collapse: "a",
border_image: "a",
border_image_outset: "a",
border_image_repeat: "a",
border_image_slice: "a",
border_image_source: "a",
border_image_width: "a",
border_radius: "a",
border_bottom_left_radius: "a",
border_bottom_right_radius: "a",
border_top_left_radius: "a",
border_top_right_radius: "a",
border_spacing: "a",
bottom: "a",
box_decoration_break: "a",
box_shadow: "a",
box_sizing: "a",
box_snap: "a",
break_after: "a",
break_before: "a",
break_inside: "a",
buffered_rendering: "a",
caption_side: "a",
clear: "a",
clear_side: "a",
clip: "a",
clip_path: "a",
clip_rule: "a",
color: "a",
color_adjust: "a",
color_correction: "a",
color_interpolation: "a",
color_interpolation_filters: "a",
color_profile: "a",
color_rendering: "a",
column_fill: "a",
column_gap: "a",
column_rule: "a",
column_rule_color: "a",
column_rule_style: "a",
column_rule_width: "a",
column_span: "a",
columns: "a",
column_count: "a",
column_width: "a",
contain: "a",
content: "a",
counter_increment: "a",
counter_reset: "a",
counter_set: "a",
cue: "a",
cue_after: "a",
cue_before: "a",
cursor: "a",
direction: "a",
display: "a",
display_inside: "a",
display_outside: "a",
display_extras: "a",
display_box: "a",
dominant_baseline: "a",
elevation: "a",
empty_cells: "a",
enable_background: "a",
fill: "a",
fill_opacity: "a",
fill_rule: "a",
filter: "a",
float: "a",
float_defer_column: "a",
float_defer_page: "a",
float_offset: "a",
float_wrap: "a",
flow_into: "a",
flow_from: "a",
flex: "a",
flex_basis: "a",
flex_grow: "a",
flex_shrink: "a",
flex_flow: "a",
flex_direction: "a",
flex_wrap: "a",
flood_color: "a",
flood_opacity: "a",
font: "a",
font_family: "a",
font_size: "a",
font_stretch: "a",
font_style: "a",
font_weight: "a",
font_feature_settings: "a",
font_kerning: "a",
font_language_override: "a",
font_size_adjust: "a",
font_synthesis: "a",
font_variant: "a",
font_variant_alternates: "a",
font_variant_caps: "a",
font_variant_east_asian: "a",
font_variant_ligatures: "a",
font_variant_numeric: "a",
font_variant_position: "a",
footnote_policy: "a",
glyph_orientation_horizontal: "a",
glyph_orientation_vertical: "a",
grid: "a",
grid_auto_flow: "a",
grid_auto_columns: "a",
grid_auto_rows: "a",
grid_template: "a",
grid_template_areas: "a",
grid_template_columns: "a",
grid_template_rows: "a",
grid_area: "a",
grid_column: "a",
grid_column_start: "a",
grid_column_end: "a",
grid_row: "a",
grid_row_start: "a",
grid_row_end: "a",
hanging_punctuation: "a",
height: "a",
hyphenate_character: "a",
hyphenate_limit_chars: "a",
hyphenate_limit_last: "a",
hyphenate_limit_lines: "a",
hyphenate_limit_zone: "a",
hyphens: "a",
icon: "a",
image_orientation: "a",
image_resolution: "a",
image_rendering: "a",
ime: "a",
ime_align: "a",
ime_mode: "a",
ime_offset: "a",
ime_width: "a",
initial_letters: "a",
inline_box_align: "a",
isolation: "a",
justify_content: "a",
justify_items: "a",
justify_self: "a",
kerning: "a",
left: "a",
letter_spacing: "a",
lighting_color: "a",
line_box_contain: "a",
line_break: "a",
line_grid: "a",
line_height: "a",
line_slack: "a",
line_snap: "a",
list_style: "a",
list_style_image: "a",
list_style_position: "a",
list_style_type: "a",
margin: "a",
margin_bottom: "a",
margin_left: "a",
margin_right: "a",
margin_top: "a",
marker: "a",
marker_end: "a",
marker_mid: "a",
marker_pattern: "a",
marker_segment: "a",
marker_start: "a",
marker_knockout_left: "a",
marker_knockout_right: "a",
marker_side: "a",
marks: "a",
marquee_direction: "a",
marquee_play_count: "a",
marquee_speed: "a",
marquee_style: "a",
mask: "a",
mask_image: "a",
mask_repeat: "a",
mask_position: "a",
mask_clip: "a",
mask_origin: "a",
mask_size: "a",
mask_box: "a",
mask_box_outset: "a",
mask_box_repeat: "a",
mask_box_slice: "a",
mask_box_source: "a",
mask_box_width: "a",
mask_type: "a",
max_height: "a",
max_lines: "a",
max_width: "a",
min_height: "a",
min_width: "a",
mix_blend_mode: "a",
nav_down: "a",
nav_index: "a",
nav_left: "a",
nav_right: "a",
nav_up: "a",
object_fit: "a",
object_position: "a",
offset_after: "a",
offset_before: "a",
offset_end: "a",
offset_start: "a",
opacity: "a",
order: "a",
orphans: "a",
outline: "a",
outline_color: "a",
outline_style: "a",
outline_width: "a",
outline_offset: "a",
overflow: "a",
overflow_x: "a",
overflow_y: "a",
overflow_style: "a",
overflow_wrap: "a",
padding: "a",
padding_bottom: "a",
padding_left: "a",
padding_right: "a",
padding_top: "a",
page: "a",
page_break_after: "a",
page_break_before: "a",
page_break_inside: "a",
paint_order: "a",
pause: "a",
pause_after: "a",
pause_before: "a",
perspective: "a",
perspective_origin: "a",
pitch: "a",
pitch_range: "a",
play_during: "a",
pointer_events: "a",
position: "a",
quotes: "a",
region_fragment: "a",
resize: "a",
rest: "a",
rest_after: "a",
rest_before: "a",
richness: "a",
right: "a",
ruby_align: "a",
ruby_merge: "a",
ruby_position: "a",
scroll_behavior: "a",
scroll_snap_coordinate: "a",
scroll_snap_destination: "a",
scroll_snap_points_x: "a",
scroll_snap_points_y: "a",
scroll_snap_type: "a",
shape_image_threshold: "a",
shape_inside: "a",
shape_margin: "a",
shape_outside: "a",
shape_padding: "a",
shape_rendering: "a",
size: "a",
speak: "a",
speak_as: "a",
speak_header: "a",
speak_numeral: "a",
speak_punctuation: "a",
speech_rate: "a",
stop_color: "a",
stop_opacity: "a",
stress: "a",
string_set: "a",
stroke: "a",
stroke_dasharray: "a",
stroke_dashoffset: "a",
stroke_linecap: "a",
stroke_linejoin: "a",
stroke_miterlimit: "a",
stroke_opacity: "a",
stroke_width: "a",
tab_size: "a",
table_layout: "a",
text_align: "a",
text_align_all: "a",
text_align_last: "a",
text_anchor: "a",
text_combine_upright: "a",
text_decoration: "a",
text_decoration_color: "a",
text_decoration_line: "a",
text_decoration_style: "a",
text_decoration_skip: "a",
text_emphasis: "a",
text_emphasis_color: "a",
text_emphasis_style: "a",
text_emphasis_position: "a",
text_emphasis_skip: "a",
text_height: "a",
text_indent: "a",
text_justify: "a",
text_orientation: "a",
text_overflow: "a",
text_rendering: "a",
text_shadow: "a",
text_size_adjust: "a",
text_space_collapse: "a",
text_spacing: "a",
text_transform: "a",
text_underline_position: "a",
text_wrap: "a",
top: "a",
touch_action: "a",
transform: "a",
transform_box: "a",
transform_origin: "a",
transform_style: "a",
transition: "a",
transition_delay: "a",
transition_duration: "a",
transition_property: "a",
unicode_bidi: "a",
vector_effect: "a",
vertical_align: "a",
visibility: "a",
voice_balance: "a",
voice_duration: "a",
voice_family: "a",
voice_pitch: "a",
voice_range: "a",
voice_rate: "a",
voice_stress: "a",
voice_volumn: "a",
volume: "a",
white_space: "a",
widows: "a",
width: "a",
will_change: "a",
word_break: "a",
word_spacing: "a",
word_wrap: "a",
wrap_flow: "a",
wrap_through: "a",
writing_mode: "a",
z_index: "a",
"This example isn't quite useful yet"
}
})
}
examples/all_events.rs
+2 -2
View File
@@ -1,4 +1,4 @@
use dioxus::{events::*, prelude::*};
use dioxus::{events::*, html::MouseEvent, prelude::*};
fn main() {
dioxus_desktop::launch(app);
@@ -41,7 +41,7 @@ const RECT_STYLE: &str = r#"
"#;
fn app(cx: Scope) -> Element {
let events = use_ref(&cx, std::collections::VecDeque::new);
let events = use_ref(cx, std::collections::VecDeque::new);
let log_event = move |event: Event| {
let mut events = events.write();
examples/borrowed.rs
+2 -6
View File
@@ -29,9 +29,7 @@ fn app(cx: Scope) -> Element {
cx.render(rsx! {
div {
Child1 {
text: first
}
Child1 { text: first }
}
})
}
@@ -59,9 +57,7 @@ struct C2Props<'a> {
fn Child2<'a>(cx: Scope<'a, C2Props<'a>>) -> Element {
cx.render(rsx! {
Child3 {
text: cx.props.text
}
Child3 { text: cx.props.text }
})
}
examples/calculator.rs
+11 -23
View File
@@ -19,12 +19,13 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || String::from("0"));
let val = use_state(cx, || String::from("0"));
let input_digit = move |num: u8| {
if val.get() == "0" {
val.set(String::new());
}
val.make_mut().push_str(num.to_string().as_str());
};
@@ -99,12 +100,8 @@ fn app(cx: Scope) -> Element {
}
}
div { class: "digit-keys",
button { class: "calculator-key key-0", onclick: move |_| input_digit(0),
"0"
}
button { class: "calculator-key key-dot", onclick: move |_| val.make_mut().push('.'),
"●"
}
button { class: "calculator-key key-0", onclick: move |_| input_digit(0), "0" }
button { class: "calculator-key key-dot", onclick: move |_| val.make_mut().push('.'), "●" }
(1..10).map(|k| rsx!{
button {
class: "calculator-key {k}",
@@ -116,22 +113,13 @@ fn app(cx: Scope) -> Element {
}
}
div { class: "operator-keys",
button { class: "calculator-key key-divide", onclick: move |_| input_operator("/"),
"÷"
}
button { class: "calculator-key key-multiply", onclick: move |_| input_operator("*"),
"×"
}
button { class: "calculator-key key-subtract", onclick: move |_| input_operator("-"),
"−"
}
button { class: "calculator-key key-add", onclick: move |_| input_operator("+"),
"+"
}
button { class: "calculator-key key-equals",
onclick: move |_| {
val.set(format!("{}", calc_val(val.as_str())));
},
button { class: "calculator-key key-divide", onclick: move |_| input_operator("/"), "÷" }
button { class: "calculator-key key-multiply", onclick: move |_| input_operator("*"), "×" }
button { class: "calculator-key key-subtract", onclick: move |_| input_operator("-"), "−" }
button { class: "calculator-key key-add", onclick: move |_| input_operator("+"), "+" }
button {
class: "calculator-key key-equals",
onclick: move |_| val.set(format!("{}", calc_val(val.as_str()))),
"="
}
}
examples/callback.rs
+22
View File
@@ -0,0 +1,22 @@
use dioxus::prelude::*;
fn main() {
dioxus_desktop::launch(app);
}
fn app(cx: Scope) -> Element {
let login = use_callback!(cx, move |_| async move {
let res = reqwest::get("https://dog.ceo/api/breeds/list/all")
.await
.unwrap()
.text()
.await
.unwrap();
println!("{:#?}, ", res);
});
cx.render(rsx! {
button { onclick: login, "Click me!" }
})
}
examples/crm.rs
+4 -4
View File
@@ -16,10 +16,10 @@ pub struct Client {
}
fn app(cx: Scope) -> Element {
let clients = use_ref(&cx, || vec![] as Vec<Client>);
let firstname = use_state(&cx, String::new);
let lastname = use_state(&cx, String::new);
let description = use_state(&cx, String::new);
let clients = use_ref(cx, || vec![] as Vec<Client>);
let firstname = use_state(cx, String::new);
let lastname = use_state(cx, String::new);
let description = use_state(cx, String::new);
cx.render(rsx!(
body {
examples/custom_element.rs
+9 -7
View File
@@ -10,21 +10,23 @@ fn main() {
let mut dom = VirtualDom::new(app);
let _ = dom.rebuild();
let output = dioxus_ssr::render_vdom(&dom);
let output = dioxus_ssr::render(&dom);
println!("{}", output);
}
fn app(cx: Scope) -> Element {
let nf = NodeFactory::new(&cx);
// let nf = NodeFactory::new(cx);
let mut attrs = dioxus::core::exports::bumpalo::collections::Vec::new_in(nf.bump());
// let mut attrs = dioxus::core::exports::bumpalo::collections::Vec::new_in(nf.bump());
attrs.push(nf.attr("client-id", format_args!("abc123"), None, false));
// attrs.push(nf.attr("client-id", format_args!("abc123"), None, false));
attrs.push(nf.attr("name", format_args!("bob"), None, false));
// attrs.push(nf.attr("name", format_args!("bob"), None, false));
attrs.push(nf.attr("age", format_args!("47"), None, false));
// attrs.push(nf.attr("age", format_args!("47"), None, false));
Some(nf.raw_element("my-element", None, &[], attrs.into_bump_slice(), &[], None))
// Some(nf.raw_element("my-element", None, &[], attrs.into_bump_slice(), &[], None))
todo!()
}
examples/disabled.rs
+1 -1
View File
@@ -5,7 +5,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let disabled = use_state(&cx, || false);
let disabled = use_state(cx, || false);
cx.render(rsx! {
div {
examples/dog_app.rs
+26 -34
View File
@@ -1,12 +1,8 @@
#![allow(non_snake_case)]
//! Render a bunch of doggos!
use dioxus::prelude::*;
use std::collections::HashMap;
fn main() {
dioxus_desktop::launch(app);
dioxus_desktop::launch(|cx| render!(app_root {}));
}
#[derive(Debug, Clone, PartialEq, serde::Deserialize)]
@@ -14,10 +10,10 @@ struct ListBreeds {
message: HashMap<String, Vec<String>>,
}
fn app(cx: Scope) -> Element {
let breed = use_state(&cx, || None);
async fn app_root(cx: Scope<'_>) -> Element {
let breed = use_state(cx, || "deerhound".to_string());
let breeds = use_future(&cx, (), |_| async move {
let breeds = use_future!(cx, || async move {
reqwest::get("https://dog.ceo/api/breeds/list/all")
.await
.unwrap()
@@ -25,32 +21,26 @@ fn app(cx: Scope) -> Element {
.await
});
match breeds.value() {
Some(Ok(breeds)) => cx.render(rsx! {
div {
match breeds.await {
Ok(breeds) => cx.render(rsx! {
div { height: "500px",
h1 { "Select a dog breed!" }
div { display: "flex",
ul { flex: "50%",
breeds.message.keys().map(|cur_breed| rsx!(
li {
for cur_breed in breeds.message.keys().take(10) {
li { key: "{cur_breed}",
button {
onclick: move |_| breed.set(Some(cur_breed.clone())),
onclick: move |_| breed.set(cur_breed.clone()),
"{cur_breed}"
}
}
))
}
div { flex: "50%",
match breed.get() {
Some(breed) => rsx!( Breed { breed: breed.clone() } ),
None => rsx!("No Breed selected"),
}
}
div { flex: "50%", breed_pic { breed: breed.to_string() } }
}
}
}),
Some(Err(_e)) => cx.render(rsx! { div { "Error fetching breeds" } }),
None => cx.render(rsx! { div { "Loading dogs..." } }),
Err(_e) => cx.render(rsx! { div { "Error fetching breeds" } }),
}
}
@@ -60,8 +50,8 @@ struct DogApi {
}
#[inline_props]
fn Breed(cx: Scope, breed: String) -> Element {
let fut = use_future(&cx, (breed,), |(breed,)| async move {
async fn breed_pic(cx: Scope, breed: String) -> Element {
let fut = use_future!(cx, |breed| async move {
reqwest::get(format!("https://dog.ceo/api/breed/{}/images/random", breed))
.await
.unwrap()
@@ -69,21 +59,23 @@ fn Breed(cx: Scope, breed: String) -> Element {
.await
});
cx.render(match fut.value() {
Some(Ok(resp)) => rsx! {
button {
onclick: move |_| fut.restart(),
"Click to fetch another doggo"
}
match fut.await {
Ok(resp) => render! {
div {
button {
onclick: move |_| {
println!("clicked");
fut.restart()
},
"Click to fetch another doggo"
}
img {
src: "{resp.message}",
max_width: "500px",
max_height: "500px",
src: "{resp.message}",
}
}
},
Some(Err(_)) => rsx! { div { "loading dogs failed" } },
None => rsx! { div { "loading dogs..." } },
})
Err(_) => render! { div { "loading dogs failed" } },
}
}
examples/error_handle.rs
+13 -1
View File
@@ -5,7 +5,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || "0.0001");
let val = use_state(cx, || "0.0001");
let num = match val.parse::<f32>() {
Err(_) => return cx.render(rsx!("Parsing failed")),
@@ -18,5 +18,17 @@ fn app(cx: Scope) -> Element {
onclick: move |_| val.set("invalid"),
"Set an invalid number"
}
(0..5).map(|i| rsx! {
demo_c { x: i }
})
})
}
#[inline_props]
fn demo_c(cx: Scope, x: i32) -> Element {
cx.render(rsx! {
h1 {
"asdasdasdasd {x}"
}
})
}
examples/eval.rs
+3 -3
View File
@@ -6,9 +6,9 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let script = use_state(&cx, String::new);
let eval = dioxus_desktop::use_eval(&cx);
let future: &UseRef<Option<EvalResult>> = use_ref(&cx, || None);
let script = use_state(cx, String::new);
let eval = dioxus_desktop::use_eval(cx);
let future: &UseRef<Option<EvalResult>> = use_ref(cx, || None);
if future.read().is_some() {
let future_clone = future.clone();
cx.spawn(async move {
examples/fermi.rs
+4 -4
View File
@@ -10,17 +10,17 @@ fn main() {
static NAME: Atom<String> = |_| "world".to_string();
fn app(cx: Scope) -> Element {
let name = use_read(&cx, NAME);
let name = use_read(cx, NAME);
cx.render(rsx! {
div { "hello {name}!" }
Child {}
ChildWithRef{}
ChildWithRef {}
})
}
fn Child(cx: Scope) -> Element {
let set_name = use_set(&cx, NAME);
let set_name = use_set(cx, NAME);
cx.render(rsx! {
button {
@@ -33,7 +33,7 @@ fn Child(cx: Scope) -> Element {
static NAMES: AtomRef<Vec<String>> = |_| vec!["world".to_string()];
fn ChildWithRef(cx: Scope) -> Element {
let names = use_atom_ref(&cx, NAMES);
let names = use_atom_ref(cx, NAMES);
cx.render(rsx! {
div {
examples/file_explorer.rs
+3 -3
View File
@@ -19,9 +19,9 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let files = use_ref(&cx, Files::new);
let files = use_ref(cx, Files::new);
render! {
cx.render(rsx! {
div {
link { href:"https://fonts.googleapis.com/icon?family=Material+Icons", rel:"stylesheet", }
style { include_str!("./assets/fileexplorer.css") }
@@ -62,7 +62,7 @@ fn app(cx: Scope) -> Element {
})
}
}
}
})
}
struct Files {
examples/framework_benchmark.rs
+3 -3
View File
@@ -32,8 +32,8 @@ impl Label {
}
fn app(cx: Scope) -> Element {
let items = use_ref(&cx, Vec::new);
let selected = use_state(&cx, || None);
let items = use_ref(cx, Vec::new);
let selected = use_state(cx, || None);
cx.render(rsx! {
div { class: "container",
@@ -72,7 +72,7 @@ fn app(cx: Scope) -> Element {
td { class:"col-md-1" }
td { class:"col-md-1", "{item.key}" }
td { class:"col-md-1", onclick: move |_| selected.set(Some(id)),
a { class: "lbl", item.labels }
a { class: "lbl", "{item.labels[0]}{item.labels[1]}{item.labels[2]}" }
}
td { class: "col-md-1",
a { class: "remove", onclick: move |_| { items.write().remove(id); },
examples/generic_component.rs
+13
View File
@@ -0,0 +1,13 @@
use dioxus::prelude::*;
fn main() {
dioxus_desktop::launch(app);
}
fn app(cx: Scope) -> Element {
cx.render(rsx! { generic_child::<i32>{} })
}
fn generic_child<T>(cx: Scope) -> Element {
cx.render(rsx! { div {} })
}
examples/hydration.rs
+2 -2
View File
@@ -14,13 +14,13 @@ use dioxus_desktop::Config;
fn main() {
let vdom = VirtualDom::new(app);
let content = dioxus_ssr::render_vdom_cfg(&vdom, |f| f.pre_render(true));
let content = dioxus_ssr::pre_render(&vdom);
dioxus_desktop::launch_cfg(app, Config::new().with_prerendered(content));
}
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || 0);
let val = use_state(cx, || 0);
cx.render(rsx! {
div {
examples/inlineprops.rs
+1 -1
View File
@@ -28,7 +28,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let state = use_state(&cx, || 1);
let state = use_state(cx, || 1);
cx.render(rsx! {
div {
examples/inputs.rs
+3 -5
View File
@@ -2,7 +2,7 @@
//!
//! There is some conversion happening when input types are checkbox/radio/select/textarea etc.
use dioxus::{events::FormEvent, prelude::*};
use dioxus::prelude::*;
fn main() {
dioxus_desktop::launch(app);
@@ -28,7 +28,6 @@ const FIELDS: &[(&str, &str)] = &[
("text", ""),
("time", ""),
("url", ""),
//
// less supported things
("hidden", ""),
("month", ""), // degrades to text most of the time, but works properly as "value'"
@@ -114,7 +113,7 @@ fn app(cx: Scope) -> Element {
}
}
FIELDS.iter().map(|(field, value)| rsx!(
FIELDS.iter().map(|(field, value)| rsx! {
div {
input {
id: "{field}",
@@ -131,8 +130,7 @@ fn app(cx: Scope) -> Element {
}
br {}
}
))
})
}
})
}
examples/login_form.rs
+2 -4
View File
@@ -1,7 +1,6 @@
//! This example demonstrates the following:
//! Futures in a callback, Router, and Forms
use dioxus::events::*;
use dioxus::prelude::*;
fn main() {
@@ -37,11 +36,10 @@ fn app(cx: Scope) -> Element {
form {
onsubmit: onsubmit,
prevent_default: "onsubmit", // Prevent the default behavior of <form> to post
input { "type": "text", id: "username", name: "username" }
input { r#type: "text", id: "username", name: "username" }
label { "Username" }
br {}
input { "type": "password", id: "password", name: "password" }
input { r#type: "password", id: "password", name: "password" }
label { "Password" }
br {}
button { "Login" }
examples/nested_listeners.rs
+1 -1
View File
@@ -22,7 +22,7 @@ fn app(cx: Scope) -> Element {
button {
onclick: move |evt| {
println!("clicked! bottom no bubbling");
evt.cancel_bubble();
evt.stop_propogation();
},
"Dont propogate"
}
examples/pattern_model.rs
+2 -1
View File
@@ -19,6 +19,7 @@
use dioxus::events::*;
use dioxus::html::input_data::keyboard_types::Key;
use dioxus::html::MouseEvent;
use dioxus::prelude::*;
use dioxus_desktop::wry::application::dpi::LogicalSize;
use dioxus_desktop::{Config, WindowBuilder};
@@ -35,7 +36,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let state = use_ref(&cx, Calculator::new);
let state = use_ref(cx, Calculator::new);
cx.render(rsx! {
style { include_str!("./assets/calculator.css") }
examples/pattern_reducer.rs
+1 -1
View File
@@ -15,7 +15,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let state = use_state(&cx, PlayerState::new);
let state = use_state(cx, PlayerState::new);
cx.render(rsx!(
div {
examples/readme.rs
+1 -1
View File
@@ -9,7 +9,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx! {
h1 { "High-Five counter: {count}" }
examples/router.rs
+3 -3
View File
@@ -30,7 +30,7 @@ fn app(cx: Scope) -> Element {
}
fn BlogPost(cx: Scope) -> Element {
let post = dioxus_router::use_route(&cx).last_segment()?;
let post = dioxus_router::use_route(cx).last_segment().unwrap();
cx.render(rsx! {
div {
@@ -46,9 +46,9 @@ struct Query {
}
fn User(cx: Scope) -> Element {
let post = dioxus_router::use_route(&cx).last_segment()?;
let post = dioxus_router::use_route(cx).last_segment().unwrap();
let query = dioxus_router::use_route(&cx)
let query = dioxus_router::use_route(cx)
.query::<Query>()
.unwrap_or(Query { bold: false });
examples/rsx_compile_fail.rs
+7 -6
View File
@@ -5,21 +5,22 @@ use dioxus::prelude::*;
fn main() {
let mut vdom = VirtualDom::new(example);
vdom.rebuild();
_ = vdom.rebuild();
let out = dioxus_ssr::render_vdom_cfg(&vdom, |c| c.newline(true).indent(true));
println!("{}", out);
let mut renderer = dioxus_ssr::Renderer::new();
renderer.pretty = true;
renderer.render(&vdom);
}
fn example(cx: Scope) -> Element {
let items = use_state(&cx, || {
let items = use_state(cx, || {
vec![Thing {
a: "asd".to_string(),
b: 10,
}]
});
let things = use_ref(&cx, || {
let things = use_ref(cx, || {
vec![Thing {
a: "asd".to_string(),
b: 10,
@@ -27,7 +28,7 @@ fn example(cx: Scope) -> Element {
});
let things_list = things.read();
let mything = use_ref(&cx, || Some(String::from("asd")));
let mything = use_ref(cx, || Some(String::from("asd")));
let mything_read = mything.read();
cx.render(rsx!(
examples/rsx_usage.rs
+4 -4
View File
@@ -165,13 +165,13 @@ fn app(cx: Scope) -> Element {
// Can pass in props directly as an expression
{
let props = TallerProps {a: "hello", children: Default::default()};
let props = TallerProps {a: "hello", children: cx.render(rsx!(()))};
rsx!(Taller { ..props })
}
// Spreading can also be overridden manually
Taller {
..TallerProps { a: "ballin!", children: Default::default() },
..TallerProps { a: "ballin!", children: cx.render(rsx!(()) )},
a: "not ballin!"
}
@@ -183,7 +183,7 @@ fn app(cx: Scope) -> Element {
// Components can be generic too
// This component takes i32 type to give you typed input
TypedInput::<TypedInputProps<i32>> {}
TypedInput::<i32> {}
// Type inference can be used too
TypedInput { initial: 10.0 }
@@ -200,7 +200,7 @@ fn app(cx: Scope) -> Element {
// helper functions
// Anything that implements IntoVnode can be dropped directly into Rsx
helper(&cx, "hello world!")
helper(cx, "hello world!")
// Strings can be supplied directly
String::from("Hello world!")
examples/simple_list.rs
+16 -13
View File
@@ -6,23 +6,26 @@ fn main() {
fn app(cx: Scope) -> Element {
cx.render(rsx!(
// Use Map directly to lazily pull elements
(0..10).map(|f| rsx! { "{f}" }),
// Collect into an intermediate collection if necessary
["a", "b", "c"]
.into_iter()
.map(|f| rsx! { "{f}" })
.collect::<Vec<_>>(),
// Use optionals
Some(rsx! { "Some" }),
div {
// Use Map directly to lazily pull elements
(0..10).map(|f| rsx! { "{f}" }),
// Collect into an intermediate collection if necessary, and call into_iter
["a", "b", "c", "d", "e", "f"]
.into_iter()
.map(|f| rsx! { "{f}" })
.collect::<Vec<_>>()
.into_iter(),
// Use optionals
Some(rsx! { "Some" }),
// use a for loop where the body itself is RSX
for name in 0..10 {
rsx! { "{name}" }
div {"{name}"}
}
// Or even use an unterminated conditional
if true {
rsx!{ "hello world!" }
}
examples/ssr.rs
+5 -12
View File
@@ -2,15 +2,13 @@
//!
//! This example shows how we can render the Dioxus Virtualdom using SSR.
use std::fmt::Write;
use dioxus::prelude::*;
fn main() {
// We can render VirtualDoms
let mut vdom = VirtualDom::new(app);
let _ = vdom.rebuild();
println!("{}", dioxus_ssr::render_vdom(&vdom));
println!("{}", dioxus_ssr::render(&vdom));
// Or we can render rsx! calls themselves
println!(
@@ -23,17 +21,12 @@ fn main() {
);
// We can configure the SSR rendering to add ids for rehydration
println!(
"{}",
dioxus_ssr::render_vdom_cfg(&vdom, |c| c.pre_render(true))
);
println!("{}", dioxus_ssr::pre_render(&vdom));
// We can even render as a writer
// We can render to a buf directly too
let mut file = String::new();
let _ = file.write_fmt(format_args!(
"{}",
dioxus_ssr::TextRenderer::from_vdom(&vdom, Default::default())
));
let mut renderer = dioxus_ssr::Renderer::default();
renderer.render_to(&mut file, &vdom).unwrap();
println!("{}", file);
}
examples/suspense.rs
+1 -1
View File
@@ -53,7 +53,7 @@ fn app(cx: Scope) -> Element {
/// Suspense is achieved my moving the future into only the component that
/// actually renders the data.
fn Doggo(cx: Scope) -> Element {
let fut = use_future(&cx, (), |_| async move {
let fut = use_future(cx, (), |_| async move {
reqwest::get("https://dog.ceo/api/breeds/image/random/")
.await
.unwrap()
examples/svg.rs
+15 -13
View File
@@ -1,15 +1,15 @@
// Thanks to @japsu and their project https://github.com/japsu/jatsi for the example!
use dioxus::{events::MouseEvent, prelude::*};
use dioxus::prelude::*;
fn main() {
dioxus_desktop::launch(app);
}
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || 5);
let val = use_state(cx, || 5);
render! {
cx.render(rsx! {
div {
user_select: "none",
webkit_user_select: "none",
@@ -31,7 +31,7 @@ fn app(cx: Scope) -> Element {
}
}
}
}
})
}
#[derive(Props)]
@@ -70,19 +70,21 @@ pub fn Die<'a>(cx: Scope<'a, DieProps<'a>>) -> Element {
.map(|((x, y), _)| {
let dcx = x * OFFSET;
let dcy = y * OFFSET;
rsx!(circle {
cx: "{dcx}",
cy: "{dcy}",
r: "{DOT_RADIUS}",
fill: "#333"
})
rsx! {
circle {
cx: "{dcx}",
cy: "{dcy}",
r: "{DOT_RADIUS}",
fill: "#333"
}
}
});
render! {
cx.render(rsx! {
svg {
onclick: move |e| cx.props.onclick.call(e),
prevent_default: "onclick",
"dioxus-prevent-default": "onclick",
class: "die",
view_box: "-1000 -1000 2000 2000",
@@ -97,5 +99,5 @@ pub fn Die<'a>(cx: Scope<'a, DieProps<'a>>) -> Element {
dots
}
}
})
}
examples/tasks.rs
+2 -2
View File
@@ -10,9 +10,9 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let count = use_state(&cx, || 0);
let count = use_state(cx, || 0);
use_future(&cx, (), move |_| {
use_future(cx, (), move |_| {
let mut count = count.clone();
async move {
loop {
examples/textarea.rs
+1 -1
View File
@@ -7,7 +7,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let model = use_state(&cx, || String::from("asd"));
let model = use_state(cx, || String::from("asd"));
println!("{}", model);
examples/todomvc.rs
+8 -6
View File
@@ -22,10 +22,10 @@ pub struct TodoItem {
}
pub fn app(cx: Scope<()>) -> Element {
let todos = use_state(&cx, im_rc::HashMap::<u32, TodoItem>::default);
let filter = use_state(&cx, || FilterState::All);
let draft = use_state(&cx, || "".to_string());
let todo_id = use_state(&cx, || 0);
let todos = use_state(cx, im_rc::HashMap::<u32, TodoItem>::default);
let filter = use_state(cx, || FilterState::All);
let draft = use_state(cx, || "".to_string());
let todo_id = use_state(cx, || 0);
// Filter the todos based on the filter state
let mut filtered_todos = todos
@@ -57,7 +57,9 @@ pub fn app(cx: Scope<()>) -> Element {
placeholder: "What needs to be done?",
value: "{draft}",
autofocus: "true",
oninput: move |evt| draft.set(evt.value.clone()),
oninput: move |evt| {
draft.set(evt.value.clone());
},
onkeydown: move |evt| {
if evt.key() == Key::Enter && !draft.is_empty() {
todos.make_mut().insert(
@@ -114,7 +116,7 @@ pub struct TodoEntryProps<'a> {
}
pub fn TodoEntry<'a>(cx: Scope<'a, TodoEntryProps<'a>>) -> Element {
let is_editing = use_state(&cx, || false);
let is_editing = use_state(cx, || false);
let todos = cx.props.todos.get();
let todo = &todos[&cx.props.id];
examples/window_event.rs
+10 -10
View File
@@ -12,15 +12,15 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let window = dioxus_desktop::use_window(&cx);
let window = dioxus_desktop::use_window(cx);
// if you want to make window fullscreen, you need close the resizable.
// window.set_fullscreen(true);
// window.set_resizable(false);
let fullscreen = use_state(&cx, || false);
let always_on_top = use_state(&cx, || false);
let decorations = use_state(&cx, || false);
let fullscreen = use_state(cx, || false);
let always_on_top = use_state(cx, || false);
let decorations = use_state(cx, || false);
cx.render(rsx!(
link { href:"https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css", rel:"stylesheet" }
@@ -35,13 +35,13 @@ fn app(cx: Scope) -> Element {
nav { class: "md:ml-auto flex flex-wrap items-center text-base justify-center" }
button {
class: "inline-flex items-center bg-gray-800 border-0 py-1 px-3 focus:outline-none hover:bg-gray-700 rounded text-base mt-4 md:mt-0",
onmousedown: |evt| evt.cancel_bubble(),
onmousedown: |evt| evt.stop_propogation(),
onclick: move |_| window.set_minimized(true),
"Minimize"
}
button {
class: "inline-flex items-center bg-gray-800 border-0 py-1 px-3 focus:outline-none hover:bg-gray-700 rounded text-base mt-4 md:mt-0",
onmousedown: |evt| evt.cancel_bubble(),
onmousedown: |evt| evt.stop_propogation(),
onclick: move |_| {
window.set_fullscreen(!**fullscreen);
@@ -52,7 +52,7 @@ fn app(cx: Scope) -> Element {
}
button {
class: "inline-flex items-center bg-gray-800 border-0 py-1 px-3 focus:outline-none hover:bg-gray-700 rounded text-base mt-4 md:mt-0",
onmousedown: |evt| evt.cancel_bubble(),
onmousedown: |evt| evt.stop_propogation(),
onclick: move |_| window.close(),
"Close"
}
@@ -66,7 +66,7 @@ fn app(cx: Scope) -> Element {
div {
button {
class: "inline-flex items-center text-white bg-green-500 border-0 py-1 px-3 hover:bg-green-700 rounded",
onmousedown: |evt| evt.cancel_bubble(),
onmousedown: |evt| evt.stop_propogation(),
onclick: move |_| {
window.set_always_on_top(!always_on_top);
always_on_top.set(!always_on_top);
@@ -77,7 +77,7 @@ fn app(cx: Scope) -> Element {
div {
button {
class: "inline-flex items-center text-white bg-blue-500 border-0 py-1 px-3 hover:bg-green-700 rounded",
onmousedown: |evt| evt.cancel_bubble(),
onmousedown: |evt| evt.stop_propogation(),
onclick: move |_| {
window.set_decorations(!decorations);
decorations.set(!decorations);
@@ -88,7 +88,7 @@ fn app(cx: Scope) -> Element {
div {
button {
class: "inline-flex items-center text-white bg-blue-500 border-0 py-1 px-3 hover:bg-green-700 rounded",
onmousedown: |evt| evt.cancel_bubble(),
onmousedown: |evt| evt.stop_propogation(),
onclick: move |_| window.set_title("Dioxus Application"),
"Change Title"
}
examples/window_zoom.rs
+2 -2
View File
@@ -6,9 +6,9 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let window = use_window(&cx);
let window = use_window(cx);
let level = use_state(&cx, || 1.0);
let level = use_state(cx, || 1.0);
cx.render(rsx! {
input {
r#type: "number",
examples/xss_safety.rs
+1 -1
View File
@@ -9,7 +9,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let contents = use_state(&cx, || {
let contents = use_state(cx, || {
String::from("<script>alert(\"hello world\")</script>")
});