mirror of
https://github.com/DioxusLabs/dioxus
synced 2024-11-11 07:04:13 +00:00
wip: more work on html
This commit is contained in:
Jonathan Kelley
parent
0dad91bc08
commit
8caabb97d8
6 changed files with 574 additions and 492 deletions
|
|
@ -7,405 +7,405 @@ 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",
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
// Thanks to @japsu and their project https://github.com/japsu/jatsi for the example!
|
||||
|
||||
use dioxus::{events::MouseData, html::MouseEvent, prelude::*};
|
||||
use dioxus::prelude::*;
|
||||
|
||||
fn main() {
|
||||
dioxus_desktop::launch(app);
|
||||
|
|
@ -9,7 +9,7 @@ fn main() {
|
|||
fn app(cx: Scope) -> Element {
|
||||
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)]
|
||||
|
|
@ -78,7 +78,7 @@ pub fn Die<'a>(cx: Scope<'a, DieProps<'a>>) -> Element {
|
|||
})
|
||||
});
|
||||
|
||||
render! {
|
||||
cx.render(rsx! {
|
||||
svg {
|
||||
onclick: move |e| cx.props.onclick.call(e),
|
||||
prevent_default: "onclick",
|
||||
|
|
@ -96,5 +96,5 @@ pub fn Die<'a>(cx: Scope<'a, DieProps<'a>>) -> Element {
|
|||
|
||||
dots
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ pub use dioxus_hooks as hooks;
|
|||
|
||||
pub mod events {
|
||||
#[cfg(feature = "html")]
|
||||
pub use dioxus_html::{AnimationEvent, FormData, FormEvent, KeyCode, KeyboardEvent, MouseData};
|
||||
pub use dioxus_html::prelude::*;
|
||||
}
|
||||
|
||||
#[cfg(feature = "html")]
|
||||
|
|
@ -32,5 +32,5 @@ pub mod prelude {
|
|||
pub use dioxus_html as dioxus_elements;
|
||||
|
||||
#[cfg(feature = "html")]
|
||||
pub use dioxus_elements::{FormEvent, GlobalAttributes, SvgAttributes};
|
||||
pub use dioxus_elements::{prelude::*, GlobalAttributes, SvgAttributes};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ use crate::geometry::{ClientPoint, Coordinates, ElementPoint, PagePoint, ScreenP
|
|||
use crate::input_data::{
|
||||
decode_mouse_button_set, encode_mouse_button_set, MouseButton, MouseButtonSet,
|
||||
};
|
||||
use dioxus_core::{Attribute, ScopeState, UiEvent};
|
||||
use dioxus_core::UiEvent;
|
||||
use keyboard_types::Modifiers;
|
||||
use std::fmt::{Debug, Formatter};
|
||||
|
||||
|
|
@ -88,6 +88,91 @@ pub struct MouseData {
|
|||
pub shift_key: bool,
|
||||
}
|
||||
|
||||
impl_event! {
|
||||
MouseData;
|
||||
|
||||
/// Execute a callback when a button is clicked.
|
||||
///
|
||||
/// ## Description
|
||||
///
|
||||
/// An element receives a click event when a pointing device button (such as a mouse's primary mouse button)
|
||||
/// is both pressed and released while the pointer is located inside the element.
|
||||
///
|
||||
/// - Bubbles: Yes
|
||||
/// - Cancelable: Yes
|
||||
/// - Interface(InteData): [`MouseEvent`]
|
||||
///
|
||||
/// If the button is pressed on one element and the pointer is moved outside the element before the button
|
||||
/// is released, the event is fired on the most specific ancestor element that contained both elements.
|
||||
/// `click` fires after both the `mousedown` and `mouseup` events have fired, in that order.
|
||||
///
|
||||
/// ## Example
|
||||
/// ```rust, ignore
|
||||
/// rsx!( button { "click me", onclick: move |_| log::info!("Clicked!`") } )
|
||||
/// ```
|
||||
///
|
||||
/// ## Reference
|
||||
/// - <https://www.w3schools.com/tags/ev_onclick.asp>
|
||||
/// - <https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event>
|
||||
onclick
|
||||
|
||||
/// oncontextmenu
|
||||
oncontextmenu
|
||||
|
||||
/// ondoubleclick
|
||||
ondoubleclick
|
||||
|
||||
/// ondoubleclick
|
||||
ondblclick
|
||||
|
||||
/// ondrag
|
||||
ondrag
|
||||
|
||||
/// ondragend
|
||||
ondragend
|
||||
|
||||
/// ondragenter
|
||||
ondragenter
|
||||
|
||||
/// ondragexit
|
||||
ondragexit
|
||||
|
||||
/// ondragleave
|
||||
ondragleave
|
||||
|
||||
/// ondragover
|
||||
ondragover
|
||||
|
||||
/// ondragstart
|
||||
ondragstart
|
||||
|
||||
/// ondrop
|
||||
ondrop
|
||||
|
||||
/// onmousedown
|
||||
onmousedown
|
||||
|
||||
/// onmouseenter
|
||||
onmouseenter
|
||||
|
||||
/// onmouseleave
|
||||
onmouseleave
|
||||
|
||||
/// onmousemove
|
||||
onmousemove
|
||||
|
||||
/// onmouseout
|
||||
onmouseout
|
||||
|
||||
/// onmouseover
|
||||
///
|
||||
/// Triggered when the users's mouse hovers over an element.
|
||||
onmouseover
|
||||
|
||||
/// onmouseup
|
||||
onmouseup
|
||||
}
|
||||
|
||||
impl MouseData {
|
||||
/// Construct MouseData with the specified properties
|
||||
///
|
||||
|
|
@ -217,88 +302,3 @@ impl Debug for MouseData {
|
|||
.finish()
|
||||
}
|
||||
}
|
||||
|
||||
impl_event! {
|
||||
MouseData;
|
||||
|
||||
/// Execute a callback when a button is clicked.
|
||||
///
|
||||
/// ## Description
|
||||
///
|
||||
/// An element receives a click event when a pointing device button (such as a mouse's primary mouse button)
|
||||
/// is both pressed and released while the pointer is located inside the element.
|
||||
///
|
||||
/// - Bubbles: Yes
|
||||
/// - Cancelable: Yes
|
||||
/// - Interface(InteData): [`MouseEvent`]
|
||||
///
|
||||
/// If the button is pressed on one element and the pointer is moved outside the element before the button
|
||||
/// is released, the event is fired on the most specific ancestor element that contained both elements.
|
||||
/// `click` fires after both the `mousedown` and `mouseup` events have fired, in that order.
|
||||
///
|
||||
/// ## Example
|
||||
/// ```rust, ignore
|
||||
/// rsx!( button { "click me", onclick: move |_| log::info!("Clicked!`") } )
|
||||
/// ```
|
||||
///
|
||||
/// ## Reference
|
||||
/// - <https://www.w3schools.com/tags/ev_onclick.asp>
|
||||
/// - <https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event>
|
||||
onclick
|
||||
|
||||
/// oncontextmenu
|
||||
oncontextmenu
|
||||
|
||||
/// ondoubleclick
|
||||
ondoubleclick
|
||||
|
||||
/// ondoubleclick
|
||||
ondblclick
|
||||
|
||||
/// ondrag
|
||||
ondrag
|
||||
|
||||
/// ondragend
|
||||
ondragend
|
||||
|
||||
/// ondragenter
|
||||
ondragenter
|
||||
|
||||
/// ondragexit
|
||||
ondragexit
|
||||
|
||||
/// ondragleave
|
||||
ondragleave
|
||||
|
||||
/// ondragover
|
||||
ondragover
|
||||
|
||||
/// ondragstart
|
||||
ondragstart
|
||||
|
||||
/// ondrop
|
||||
ondrop
|
||||
|
||||
/// onmousedown
|
||||
onmousedown
|
||||
|
||||
/// onmouseenter
|
||||
onmouseenter
|
||||
|
||||
/// onmouseleave
|
||||
onmouseleave
|
||||
|
||||
/// onmousemove
|
||||
onmousemove
|
||||
|
||||
/// onmouseout
|
||||
onmouseout
|
||||
|
||||
/// onmouseover
|
||||
///
|
||||
/// Triggered when the users's mouse hovers over an element.
|
||||
onmouseover
|
||||
|
||||
/// onmouseup
|
||||
onmouseup
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,78 @@
|
|||
use dioxus_core::UiEvent;
|
||||
use euclid::UnknownUnit;
|
||||
use std::fmt::{Debug, Formatter};
|
||||
|
||||
use crate::geometry::{LinesVector, PagesVector, PixelsVector, WheelDelta};
|
||||
|
||||
pub type WheelEvent = UiEvent<WheelData>;
|
||||
#[cfg_attr(feature = "serialize", derive(serde::Serialize, serde::Deserialize))]
|
||||
#[derive(Clone)]
|
||||
pub struct WheelData {
|
||||
#[deprecated(since = "0.3.0", note = "use delta() instead")]
|
||||
pub delta_mode: u32,
|
||||
#[deprecated(since = "0.3.0", note = "use delta() instead")]
|
||||
pub delta_x: f64,
|
||||
#[deprecated(since = "0.3.0", note = "use delta() instead")]
|
||||
pub delta_y: f64,
|
||||
#[deprecated(since = "0.3.0", note = "use delta() instead")]
|
||||
pub delta_z: f64,
|
||||
}
|
||||
|
||||
impl_event![
|
||||
WheelData;
|
||||
|
||||
/// Called when the mouse wheel is rotated over an element.
|
||||
onwheel
|
||||
];
|
||||
|
||||
impl WheelData {
|
||||
/// Construct a new WheelData with the specified wheel movement delta
|
||||
pub fn new(delta: WheelDelta) -> Self {
|
||||
let (delta_mode, vector) = match delta {
|
||||
WheelDelta::Pixels(v) => (0, v.cast_unit::<UnknownUnit>()),
|
||||
WheelDelta::Lines(v) => (1, v.cast_unit::<UnknownUnit>()),
|
||||
WheelDelta::Pages(v) => (2, v.cast_unit::<UnknownUnit>()),
|
||||
};
|
||||
|
||||
#[allow(deprecated)]
|
||||
WheelData {
|
||||
delta_mode,
|
||||
delta_x: vector.x,
|
||||
delta_y: vector.y,
|
||||
delta_z: vector.z,
|
||||
}
|
||||
}
|
||||
|
||||
/// Construct from the attributes of the web wheel event
|
||||
pub fn from_web_attributes(delta_mode: u32, delta_x: f64, delta_y: f64, delta_z: f64) -> Self {
|
||||
#[allow(deprecated)]
|
||||
Self {
|
||||
delta_mode,
|
||||
delta_x,
|
||||
delta_y,
|
||||
delta_z,
|
||||
}
|
||||
}
|
||||
|
||||
/// The amount of wheel movement
|
||||
#[allow(deprecated)]
|
||||
pub fn delta(&self) -> WheelDelta {
|
||||
let x = self.delta_x;
|
||||
let y = self.delta_y;
|
||||
let z = self.delta_z;
|
||||
match self.delta_mode {
|
||||
0 => WheelDelta::Pixels(PixelsVector::new(x, y, z)),
|
||||
1 => WheelDelta::Lines(LinesVector::new(x, y, z)),
|
||||
2 => WheelDelta::Pages(PagesVector::new(x, y, z)),
|
||||
_ => panic!("Invalid delta mode, {:?}", self.delta_mode),
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
impl Debug for WheelData {
|
||||
fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
|
||||
f.debug_struct("WheelData")
|
||||
.field("delta", &self.delta())
|
||||
.finish()
|
||||
}
|
||||
}
|
||||
|
|
@ -24,3 +24,7 @@ pub mod input_data;
|
|||
pub use elements::*;
|
||||
pub use events::*;
|
||||
pub use global_attributes::*;
|
||||
|
||||
pub mod prelude {
|
||||
pub use crate::events::*;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue