├── .cargo └── config.toml ├── .firebaserc ├── .gitattributes ├── .github ├── FUNDING.yml ├── ISSUE_TEMPLATE │ ├── bug_report.md │ ├── config.yml │ └── documentation.md ├── PULL_REQUEST_TEMPLATE.md ├── dependabot.yml └── workflows │ ├── auto-approve-maintainer-pr.yml │ ├── benchmark-core.yml │ ├── benchmark-ssr.yml │ ├── benchmark.yml │ ├── build-api-docs.yml │ ├── build-website.yml │ ├── clippy.yml │ ├── fmt.yml │ ├── inspect-next-changelogs.yml │ ├── main-checks.yml │ ├── post-benchmark-core.yml │ ├── post-benchmark-ssr.yml │ ├── post-benchmark.yml │ ├── post-size-cmp.yml │ ├── publish-api-docs.yml │ ├── publish-examples.yml │ ├── publish-website.yml │ ├── publish.yml │ ├── size-cmp.yml │ └── test-website.yml ├── .gitignore ├── CHANGELOG.md ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── Cargo.lock ├── Cargo.toml ├── LICENSE-APACHE ├── LICENSE-MIT ├── Makefile.toml ├── README.md ├── SECURITY.md ├── api-docs ├── .gitignore ├── before-content.html └── styles.css ├── ci ├── collect_sizes.py ├── dictionary.txt ├── feature-soundness-release.sh ├── feature-soundness.sh ├── install-wasm-bindgen-cli.sh ├── make_benchmark_ssr_cmt.py ├── make_example_size_cmt.py └── spellcheck.sh ├── examples ├── .gitignore ├── README.md ├── async_clock │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── main.rs │ │ └── services.rs ├── boids │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── boid.rs │ │ ├── main.rs │ │ ├── math.rs │ │ ├── settings.rs │ │ ├── simulation.rs │ │ └── slider.rs ├── communication_child_to_parent │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── child.rs │ │ ├── main.rs │ │ └── parent.rs ├── communication_grandchild_with_grandparent │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── child.rs │ │ ├── grandparent.rs │ │ ├── main.rs │ │ └── parent.rs ├── communication_grandparent_to_grandchild │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── child.rs │ │ ├── grandparent.rs │ │ ├── main.rs │ │ └── parent.rs ├── communication_parent_to_child │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── child.rs │ │ ├── main.rs │ │ └── parent.rs ├── contexts │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ ├── main.rs │ │ ├── msg_ctx.rs │ │ ├── producer.rs │ │ ├── struct_component_producer.rs │ │ ├── struct_component_subscriber.rs │ │ └── subscriber.rs ├── counter │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ └── main.rs ├── counter_functional │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ └── main.rs ├── dyn_create_destroy_apps │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── counter.rs │ │ └── main.rs ├── file_upload │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── src │ │ └── main.rs │ └── styles.css ├── function_memory_game │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── public │ │ ├── 8-ball.png │ │ ├── back.png │ │ ├── baked-potato.png │ │ ├── dinosaur.png │ │ ├── favicon.ico │ │ ├── kronos.png │ │ ├── rocket.png │ │ ├── skinny-unicorn.png │ │ ├── that-guy.png │ │ └── zeppelin.png │ ├── scss │ │ ├── chess_board.scss │ │ ├── chess_board_card.scss │ │ ├── game_progress.scss │ │ ├── game_status_board.scss │ │ ├── index.scss │ │ ├── score_board.scss │ │ └── score_board_best_score.scss │ └── src │ │ ├── components.rs │ │ ├── components │ │ ├── app.rs │ │ ├── chessboard.rs │ │ ├── chessboard_card.rs │ │ ├── game_status_board.rs │ │ ├── score_board.rs │ │ ├── score_board_best_score.rs │ │ ├── score_board_logo.rs │ │ └── score_board_progress.rs │ │ ├── constant.rs │ │ ├── helper.rs │ │ ├── main.rs │ │ └── state.rs ├── function_router │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── data │ │ ├── keywords.txt │ │ ├── syllables.txt │ │ └── yew.txt │ ├── index.html │ ├── index.scss │ └── src │ │ ├── app.rs │ │ ├── bin │ │ └── function_router.rs │ │ ├── components │ │ ├── author_card.rs │ │ ├── mod.rs │ │ ├── nav.rs │ │ ├── pagination.rs │ │ ├── post_card.rs │ │ └── progress_delay.rs │ │ ├── content.rs │ │ ├── generator.rs │ │ ├── lib.rs │ │ └── pages │ │ ├── author.rs │ │ ├── author_list.rs │ │ ├── home.rs │ │ ├── mod.rs │ │ ├── page_not_found.rs │ │ ├── post.rs │ │ └── post_list.rs ├── function_todomvc │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ ├── components.rs │ │ ├── components │ │ ├── entry.rs │ │ ├── filter.rs │ │ ├── header_input.rs │ │ └── info_footer.rs │ │ ├── hooks.rs │ │ ├── hooks │ │ └── use_bool_toggle.rs │ │ ├── main.rs │ │ └── state.rs ├── futures │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ ├── main.rs │ │ └── markdown.rs ├── game_of_life │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── assets │ │ └── favicon.ico │ ├── index.html │ ├── src │ │ ├── cell.rs │ │ └── main.rs │ └── styles.css ├── immutable │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── array.rs │ │ ├── main.rs │ │ ├── map.rs │ │ └── string.rs ├── inner_html │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ ├── document.html │ │ └── main.rs ├── js_callback │ ├── .gitignore │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── js │ │ ├── imp.js │ │ └── unimp.js │ ├── src │ │ ├── bindings.rs │ │ └── main.rs │ └── trunk_post_build.rs ├── keyed_list │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── src │ │ ├── main.rs │ │ ├── person.rs │ │ └── random.rs │ └── styles.css ├── mount_point │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ └── main.rs ├── nested_list │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── src │ │ ├── app.rs │ │ ├── header.rs │ │ ├── item.rs │ │ ├── list.rs │ │ └── main.rs │ └── styles.scss ├── node_refs │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── src │ │ ├── input.rs │ │ └── main.rs │ └── styles.css ├── password_strength │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── app.rs │ │ ├── main.rs │ │ ├── password.rs │ │ └── text_input.rs ├── portals │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ └── main.rs ├── router │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── data │ │ ├── keywords.txt │ │ ├── syllables.txt │ │ └── yew.txt │ ├── index.html │ ├── index.scss │ └── src │ │ ├── components │ │ ├── author_card.rs │ │ ├── mod.rs │ │ ├── pagination.rs │ │ ├── post_card.rs │ │ └── progress_delay.rs │ │ ├── content.rs │ │ ├── generator.rs │ │ ├── main.rs │ │ └── pages │ │ ├── author.rs │ │ ├── author_list.rs │ │ ├── home.rs │ │ ├── mod.rs │ │ ├── page_not_found.rs │ │ ├── post.rs │ │ └── post_list.rs ├── simple_ssr │ ├── Cargo.toml │ ├── README.md │ ├── index.html │ └── src │ │ ├── bin │ │ ├── simple_ssr_hydrate.rs │ │ └── simple_ssr_server.rs │ │ └── lib.rs ├── ssr_router │ ├── Cargo.toml │ ├── README.md │ ├── index.html │ └── src │ │ ├── bin │ │ ├── ssr_router_hydrate.rs │ │ └── ssr_router_server.rs │ │ └── lib.rs ├── suspense │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ ├── main.rs │ │ ├── struct_consumer.rs │ │ └── use_sleep.rs ├── timer │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ └── main.rs ├── timer_functional │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ ├── index.scss │ └── src │ │ └── main.rs ├── todomvc │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ ├── main.rs │ │ └── state.rs ├── two_apps │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ └── main.rs ├── wasi_ssr_module │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── main.rs │ │ └── router.rs ├── web_worker_fib │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ ├── agent.rs │ │ ├── bin │ │ ├── app.rs │ │ └── worker.rs │ │ └── lib.rs ├── web_worker_prime │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ │ ├── agent.rs │ │ ├── bin │ │ ├── app.rs │ │ └── worker.rs │ │ └── lib.rs └── webgl │ ├── Cargo.toml │ ├── README.md │ ├── Trunk.toml │ ├── index.html │ └── src │ ├── basic.frag │ ├── basic.vert │ └── main.rs ├── firebase.json ├── packages ├── yew-agent-macro │ ├── Cargo.toml │ └── src │ │ ├── agent_fn.rs │ │ ├── lib.rs │ │ ├── oneshot.rs │ │ └── reactor.rs ├── yew-agent │ ├── Cargo.toml │ ├── README.md │ └── src │ │ ├── codec.rs │ │ ├── lib.rs │ │ ├── oneshot │ │ ├── bridge.rs │ │ ├── hooks.rs │ │ ├── mod.rs │ │ ├── provider.rs │ │ ├── registrar.rs │ │ ├── spawner.rs │ │ ├── traits.rs │ │ └── worker.rs │ │ ├── reach.rs │ │ ├── reactor │ │ ├── bridge.rs │ │ ├── hooks.rs │ │ ├── messages.rs │ │ ├── mod.rs │ │ ├── provider.rs │ │ ├── registrar.rs │ │ ├── scope.rs │ │ ├── spawner.rs │ │ ├── traits.rs │ │ └── worker.rs │ │ ├── scope_ext.rs │ │ ├── traits.rs │ │ ├── utils.rs │ │ └── worker │ │ ├── bridge.rs │ │ ├── handler_id.rs │ │ ├── hooks.rs │ │ ├── lifecycle.rs │ │ ├── messages.rs │ │ ├── mod.rs │ │ ├── native_worker.rs │ │ ├── provider.rs │ │ ├── registrar.rs │ │ ├── scope.rs │ │ ├── spawner.rs │ │ └── traits.rs ├── yew-macro │ ├── Cargo.toml │ ├── Makefile.toml │ ├── release.toml │ ├── src │ │ ├── classes │ │ │ └── mod.rs │ │ ├── derive_props │ │ │ ├── builder.rs │ │ │ ├── field.rs │ │ │ ├── generics.rs │ │ │ ├── mod.rs │ │ │ └── wrapper.rs │ │ ├── function_component.rs │ │ ├── hook │ │ │ ├── body.rs │ │ │ ├── lifetime.rs │ │ │ ├── mod.rs │ │ │ └── signature.rs │ │ ├── html_tree │ │ │ ├── html_block.rs │ │ │ ├── html_component.rs │ │ │ ├── html_dashed_name.rs │ │ │ ├── html_element.rs │ │ │ ├── html_if.rs │ │ │ ├── html_iterable.rs │ │ │ ├── html_list.rs │ │ │ ├── html_node.rs │ │ │ ├── lint │ │ │ │ └── mod.rs │ │ │ ├── mod.rs │ │ │ └── tag.rs │ │ ├── lib.rs │ │ ├── props │ │ │ ├── component.rs │ │ │ ├── element.rs │ │ │ ├── mod.rs │ │ │ ├── prop.rs │ │ │ └── prop_macro.rs │ │ ├── stringify.rs │ │ ├── use_prepared_state.rs │ │ └── use_transitive_state.rs │ └── tests │ │ ├── classes_macro │ │ ├── classes-fail.rs │ │ ├── classes-fail.stderr │ │ └── classes-pass.rs │ │ ├── classes_macro_test.rs │ │ ├── derive_props │ │ ├── fail.rs │ │ ├── fail.stderr │ │ └── pass.rs │ │ ├── derive_props_test.rs │ │ ├── function_attr_test.rs │ │ ├── function_component_attr │ │ ├── applied-to-non-fn-fail.rs │ │ ├── applied-to-non-fn-fail.stderr │ │ ├── async-fail.rs │ │ ├── async-fail.stderr │ │ ├── bad-name-fail.rs │ │ ├── bad-name-fail.stderr │ │ ├── bad-props-param-fail.rs │ │ ├── bad-props-param-fail.stderr │ │ ├── bad-return-type-fail.rs │ │ ├── bad-return-type-fail.stderr │ │ ├── const-fail.rs │ │ ├── const-fail.stderr │ │ ├── extern-fail.rs │ │ ├── extern-fail.stderr │ │ ├── generic-lifetime-fail.rs │ │ ├── generic-lifetime-fail.stderr │ │ ├── generic-pass.rs │ │ ├── generic-props-fail.rs │ │ ├── generic-props-fail.stderr │ │ ├── hook_location-fail.rs │ │ ├── hook_location-fail.stderr │ │ ├── hook_location-pass.rs │ │ ├── lifetime-props-param-fail.rs │ │ ├── lifetime-props-param-fail.stderr │ │ ├── multiple-param-fail.rs │ │ ├── multiple-param-fail.stderr │ │ ├── mut-ref-props-param-fail.rs │ │ ├── mut-ref-props-param-fail.stderr │ │ ├── no-name-default-pass.rs │ │ ├── with-defaulted-type-param-pass.rs │ │ ├── with-props-pass.rs │ │ ├── with-receiver-fail.rs │ │ ├── with-receiver-fail.stderr │ │ └── without-props-pass.rs │ │ ├── hook_attr │ │ ├── hook-call-generics-pass.rs │ │ ├── hook-const-generic-pass.rs │ │ ├── hook-dynamic-dispatch-pass.rs │ │ ├── hook-impl-trait-pass.rs │ │ ├── hook-lifetime-pass.rs │ │ ├── hook-return-impl-trait-pass.rs │ │ ├── hook-return-ref-pass.rs │ │ ├── hook-trait-item-pass.rs │ │ ├── hook_location-fail.rs │ │ ├── hook_location-fail.stderr │ │ ├── hook_location-pass.rs │ │ ├── hook_macro-fail.rs │ │ ├── hook_macro-fail.stderr │ │ └── hook_macro-pass.rs │ │ ├── hook_attr_test.rs │ │ ├── hook_macro │ │ ├── use_prepared_state-fail.rs │ │ ├── use_prepared_state-fail.stderr │ │ ├── use_transitive_state-fail.rs │ │ └── use_transitive_state-fail.stderr │ │ ├── hook_macro_test.rs │ │ ├── html_lints │ │ ├── fail.rs │ │ └── fail.stderr │ │ ├── html_lints_test.rs │ │ ├── html_macro │ │ ├── as-return-value-pass.rs │ │ ├── block-fail.rs │ │ ├── block-fail.stderr │ │ ├── block-pass.rs │ │ ├── component-any-children-pass.rs │ │ ├── component-fail.rs │ │ ├── component-fail.stderr │ │ ├── component-pass.rs │ │ ├── component-unimplemented-fail.rs │ │ ├── component-unimplemented-fail.stderr │ │ ├── dyn-element-pass.rs │ │ ├── element-fail.rs │ │ ├── element-fail.stderr │ │ ├── generic-component-fail.rs │ │ ├── generic-component-fail.stderr │ │ ├── generic-component-pass.rs │ │ ├── html-component-fail.stderr │ │ ├── html-element-pass.rs │ │ ├── html-if-fail.rs │ │ ├── html-if-fail.stderr │ │ ├── html-if-pass.rs │ │ ├── html-node-pass.rs │ │ ├── iterable-fail.rs │ │ ├── iterable-fail.stderr │ │ ├── iterable-pass.rs │ │ ├── list-fail.rs │ │ ├── list-fail.stderr │ │ ├── list-pass.rs │ │ ├── node-fail.rs │ │ ├── node-fail.stderr │ │ ├── node-pass.rs │ │ └── svg-pass.rs │ │ ├── html_macro_test.rs │ │ ├── props_macro │ │ ├── props-fail.rs │ │ ├── props-fail.stderr │ │ ├── props-pass.rs │ │ ├── resolve-prop-fail.rs │ │ ├── resolve-prop-fail.stderr │ │ └── resolve-prop-pass.rs │ │ └── props_macro_test.rs ├── yew-router-macro │ ├── Cargo.toml │ ├── Makefile.toml │ ├── release.toml │ ├── src │ │ ├── lib.rs │ │ └── routable_derive.rs │ └── tests │ │ ├── routable_derive │ │ ├── bad-ats-fail.rs │ │ ├── bad-ats-fail.stderr │ │ ├── invalid-not-found-fail.rs │ │ ├── invalid-not-found-fail.stderr │ │ ├── relative-path-fail.rs │ │ ├── relative-path-fail.stderr │ │ ├── route-with-hash-fail.rs │ │ ├── route-with-hash-fail.stderr │ │ ├── struct-fail.rs │ │ ├── struct-fail.stderr │ │ ├── unnamed-fields-fail.rs │ │ ├── unnamed-fields-fail.stderr │ │ └── valid-pass.rs │ │ └── routable_derive_test.rs ├── yew-router │ ├── Cargo.toml │ ├── Makefile.toml │ ├── README.md │ ├── src │ │ ├── components │ │ │ ├── link.rs │ │ │ ├── mod.rs │ │ │ └── redirect.rs │ │ ├── hooks.rs │ │ ├── lib.rs │ │ ├── macro_helpers.rs │ │ ├── navigator.rs │ │ ├── routable.rs │ │ ├── router.rs │ │ ├── scope_ext.rs │ │ ├── switch.rs │ │ └── utils.rs │ └── tests │ │ ├── basename.rs │ │ ├── browser_router.rs │ │ ├── hash_router.rs │ │ ├── link.rs │ │ ├── router_unit_tests.rs │ │ ├── url_encoded_routes.rs │ │ └── utils.rs └── yew │ ├── Cargo.toml │ ├── Makefile.toml │ ├── src │ ├── app_handle.rs │ ├── callback.rs │ ├── context.rs │ ├── dom_bundle │ │ ├── bcomp.rs │ │ ├── blist.rs │ │ ├── bnode.rs │ │ ├── bportal.rs │ │ ├── braw.rs │ │ ├── bsuspense.rs │ │ ├── btag │ │ │ ├── attributes.rs │ │ │ ├── listeners.rs │ │ │ └── mod.rs │ │ ├── btext.rs │ │ ├── fragment.rs │ │ ├── mod.rs │ │ ├── position.rs │ │ ├── subtree_root.rs │ │ ├── traits.rs │ │ └── utils.rs │ ├── functional │ │ ├── hooks │ │ │ ├── mod.rs │ │ │ ├── use_callback.rs │ │ │ ├── use_context.rs │ │ │ ├── use_effect.rs │ │ │ ├── use_force_update.rs │ │ │ ├── use_memo.rs │ │ │ ├── use_prepared_state │ │ │ │ ├── feat_hydration.rs │ │ │ │ ├── feat_hydration_ssr.rs │ │ │ │ ├── feat_none.rs │ │ │ │ ├── feat_ssr.rs │ │ │ │ └── mod.rs │ │ │ ├── use_reducer.rs │ │ │ ├── use_ref.rs │ │ │ ├── use_state.rs │ │ │ └── use_transitive_state │ │ │ │ ├── feat_hydration.rs │ │ │ │ ├── feat_hydration_ssr.rs │ │ │ │ ├── feat_none.rs │ │ │ │ ├── feat_ssr.rs │ │ │ │ └── mod.rs │ │ └── mod.rs │ ├── html │ │ ├── classes.rs │ │ ├── component │ │ │ ├── children.rs │ │ │ ├── lifecycle.rs │ │ │ ├── marker.rs │ │ │ ├── mod.rs │ │ │ ├── properties.rs │ │ │ └── scope.rs │ │ ├── conversion │ │ │ ├── into_prop_value.rs │ │ │ └── mod.rs │ │ ├── error.rs │ │ ├── listener │ │ │ ├── events.rs │ │ │ └── mod.rs │ │ └── mod.rs │ ├── lib.rs │ ├── platform.rs │ ├── renderer.rs │ ├── scheduler.rs │ ├── sealed.rs │ ├── server_renderer.rs │ ├── suspense │ │ ├── component.rs │ │ ├── hooks.rs │ │ ├── mod.rs │ │ └── suspension.rs │ ├── tests │ │ ├── layout_tests.rs │ │ └── mod.rs │ ├── utils │ │ └── mod.rs │ └── virtual_dom │ │ ├── key.rs │ │ ├── listeners.rs │ │ ├── mod.rs │ │ ├── vcomp.rs │ │ ├── vlist.rs │ │ ├── vnode.rs │ │ ├── vportal.rs │ │ ├── vraw.rs │ │ ├── vsuspense.rs │ │ ├── vtag.rs │ │ └── vtext.rs │ └── tests │ ├── common │ └── mod.rs │ ├── hydration.rs │ ├── layout.rs │ ├── mod.rs │ ├── raw_html.rs │ ├── suspense.rs │ ├── use_callback.rs │ ├── use_context.rs │ ├── use_effect.rs │ ├── use_memo.rs │ ├── use_prepared_state.rs │ ├── use_reducer.rs │ ├── use_ref.rs │ ├── use_state.rs │ └── use_transitive_state.rs ├── release.toml ├── rustfmt.toml ├── tools ├── benchmark-core │ ├── Cargo.toml │ └── benches │ │ └── vnode.rs ├── benchmark-hooks │ ├── .gitignore │ ├── Cargo.toml │ ├── Makefile.toml │ ├── README.md │ ├── index.html │ ├── package-lock.json │ ├── package.json │ └── src │ │ └── lib.rs ├── benchmark-ssr │ ├── Cargo.toml │ └── src │ │ └── main.rs ├── benchmark-struct │ ├── .gitignore │ ├── Cargo.toml │ ├── Makefile.toml │ ├── README.md │ ├── index.html │ ├── package-lock.json │ ├── package.json │ └── src │ │ └── lib.rs ├── build-examples │ ├── Cargo.toml │ └── src │ │ ├── bin │ │ └── update-wasm-opt.rs │ │ ├── lib.rs │ │ └── main.rs ├── changelog │ ├── Cargo.toml │ ├── Makefile.toml │ ├── src │ │ ├── cli.rs │ │ ├── create_log_line.rs │ │ ├── create_log_lines.rs │ │ ├── get_latest_version.rs │ │ ├── github_fetch.rs │ │ ├── github_issue_labels_fetcher.rs │ │ ├── github_user_fetcher.rs │ │ ├── lib.rs │ │ ├── log_line.rs │ │ ├── main.rs │ │ ├── mod.rs │ │ ├── new_version_level.rs │ │ ├── stdout_tag_description_changelog.rs │ │ ├── write_changelog_file.rs │ │ ├── write_log_lines.rs │ │ ├── write_version_changelog.rs │ │ └── yew_package.rs │ └── tests │ │ ├── generate_yew_changelog_file.rs │ │ ├── test_base.md │ │ └── test_expected.md ├── process-benchmark-results │ ├── Cargo.toml │ ├── Makefile.toml │ ├── README.md │ └── src │ │ └── main.rs └── website-test │ ├── Cargo.toml │ ├── Makefile.toml │ ├── build.rs │ └── src │ ├── lib.rs │ └── tutorial.rs └── website ├── .gitignore ├── .prettierignore ├── .prettierrc.json ├── README.md ├── babel.config.js ├── blog ├── 2022-01-20-hello-yew.md ├── 2022-11-24-release-0-20.md ├── 2023-09-23-release-0-21.md ├── 2024-10-14-release-0-22.md └── authors.yml ├── check-translations.js ├── community ├── awesome.md └── external-libs.mdx ├── docs ├── advanced-topics │ ├── children.mdx │ ├── how-it-works.mdx │ ├── immutable.mdx │ ├── optimizations.mdx │ ├── portals.mdx │ ├── server-side-rendering.mdx │ └── struct-components │ │ ├── callbacks.mdx │ │ ├── hoc.mdx │ │ ├── introduction.mdx │ │ ├── lifecycle.mdx │ │ ├── properties.mdx │ │ ├── refs.mdx │ │ └── scope.mdx ├── concepts │ ├── agents.mdx │ ├── basic-web-technologies │ │ ├── css.mdx │ │ ├── html.mdx │ │ ├── js.mdx │ │ ├── wasm-bindgen.mdx │ │ └── web-sys.mdx │ ├── contexts.mdx │ ├── function-components │ │ ├── callbacks.mdx │ │ ├── children.mdx │ │ ├── communication.mdx │ │ ├── generics.mdx │ │ ├── hooks │ │ │ ├── custom-hooks.mdx │ │ │ └── introduction.mdx │ │ ├── introduction.mdx │ │ ├── node-refs.mdx │ │ ├── properties.mdx │ │ ├── pure-components.mdx │ │ └── state.mdx │ ├── html │ │ ├── classes.mdx │ │ ├── components.mdx │ │ ├── conditional-rendering.mdx │ │ ├── elements.mdx │ │ ├── events.mdx │ │ ├── fragments.mdx │ │ ├── introduction.mdx │ │ ├── lists.mdx │ │ └── literals-and-expressions.mdx │ ├── router.mdx │ └── suspense.mdx ├── getting-started │ ├── build-a-sample-app.mdx │ ├── editor-setup.mdx │ ├── examples.mdx │ └── introduction.mdx ├── migration-guides │ ├── yew-agent │ │ ├── from-0_0_0-to-0_1_0.mdx │ │ └── from-0_1_0-to-0_2_0.mdx │ ├── yew-router │ │ ├── from-0_15_0-to-0_16_0.mdx │ │ └── from-0_16_0-to-0_17_0.mdx │ └── yew │ │ ├── from-0_18_0-to-0_19_0.mdx │ │ ├── from-0_19_0-to-0_20_0.mdx │ │ └── from-0_20_0-to-0_21_0.mdx ├── more │ ├── css.mdx │ ├── debugging.mdx │ ├── deployment.mdx │ ├── roadmap.mdx │ └── testing.mdx └── tutorial │ └── index.mdx ├── docusaurus.config.js ├── i18n ├── ja │ ├── code.json │ ├── docusaurus-plugin-content-blog │ │ └── options.json │ ├── docusaurus-plugin-content-docs-community │ │ └── current.json │ ├── docusaurus-plugin-content-docs-router │ │ └── current.json │ ├── docusaurus-plugin-content-docs │ │ ├── current.json │ │ ├── current │ │ │ ├── advanced-topics │ │ │ │ ├── children.mdx │ │ │ │ ├── how-it-works.mdx │ │ │ │ ├── immutable.mdx │ │ │ │ ├── optimizations.mdx │ │ │ │ ├── portals.mdx │ │ │ │ ├── server-side-rendering.mdx │ │ │ │ └── struct-components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── hoc.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lifecycle.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ ├── refs.mdx │ │ │ │ │ └── scope.mdx │ │ │ ├── concepts │ │ │ │ ├── agents.mdx │ │ │ │ ├── basic-web-technologies │ │ │ │ │ ├── css.mdx │ │ │ │ │ ├── html.mdx │ │ │ │ │ ├── js.mdx │ │ │ │ │ ├── wasm-bindgen.mdx │ │ │ │ │ └── web-sys.mdx │ │ │ │ ├── contexts.mdx │ │ │ │ ├── function-components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── children.mdx │ │ │ │ │ ├── communication.mdx │ │ │ │ │ ├── generics.mdx │ │ │ │ │ ├── hooks │ │ │ │ │ │ ├── custom-hooks.mdx │ │ │ │ │ │ └── introduction.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── node-refs.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ ├── pure-components.mdx │ │ │ │ │ └── state.mdx │ │ │ │ ├── html │ │ │ │ │ ├── classes.mdx │ │ │ │ │ ├── components.mdx │ │ │ │ │ ├── conditional-rendering.mdx │ │ │ │ │ ├── elements.mdx │ │ │ │ │ ├── events.mdx │ │ │ │ │ ├── fragments.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lists.mdx │ │ │ │ │ └── literals-and-expressions.mdx │ │ │ │ ├── router.mdx │ │ │ │ └── suspense.mdx │ │ │ ├── getting-started │ │ │ │ ├── build-a-sample-app.mdx │ │ │ │ ├── editor-setup.mdx │ │ │ │ ├── examples.mdx │ │ │ │ └── introduction.mdx │ │ │ ├── more │ │ │ │ ├── css.mdx │ │ │ │ ├── debugging.mdx │ │ │ │ ├── deployment.mdx │ │ │ │ ├── roadmap.mdx │ │ │ │ └── testing.mdx │ │ │ └── tutorial │ │ │ │ └── index.mdx │ │ ├── version-0.18.0.json │ │ ├── version-0.18.0 │ │ │ ├── advanced-topics │ │ │ │ ├── how-it-works.mdx │ │ │ │ └── optimizations.mdx │ │ │ ├── concepts │ │ │ │ ├── agents.mdx │ │ │ │ ├── components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ └── refs.mdx │ │ │ │ ├── html │ │ │ │ │ ├── components.mdx │ │ │ │ │ ├── elements.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lists.mdx │ │ │ │ │ └── literals-and-expressions.mdx │ │ │ │ ├── router.mdx │ │ │ │ └── services │ │ │ │ │ └── introduction.mdx │ │ │ ├── getting-started │ │ │ │ ├── build-a-sample-app.mdx │ │ │ │ ├── choose-web-library.mdx │ │ │ │ ├── examples.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── project-setup │ │ │ │ │ ├── using-cargo-web.mdx │ │ │ │ │ └── using-wasm-pack.mdx │ │ │ │ └── starter-templates.mdx │ │ │ └── more │ │ │ │ ├── css.mdx │ │ │ │ ├── debugging.mdx │ │ │ │ ├── external-libs.mdx │ │ │ │ ├── roadmap.mdx │ │ │ │ └── testing.mdx │ │ ├── version-0.19.0.json │ │ ├── version-0.20.json │ │ ├── version-0.20 │ │ │ ├── advanced-topics │ │ │ │ ├── how-it-works.mdx │ │ │ │ ├── optimizations.mdx │ │ │ │ └── struct-components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── lifecycle.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ └── refs.mdx │ │ │ ├── concepts │ │ │ │ ├── agents.mdx │ │ │ │ ├── html │ │ │ │ │ ├── components.mdx │ │ │ │ │ ├── elements.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lists.mdx │ │ │ │ │ └── literals-and-expressions.mdx │ │ │ │ └── router.mdx │ │ │ ├── getting-started │ │ │ │ ├── build-a-sample-app.mdx │ │ │ │ └── examples.mdx │ │ │ └── more │ │ │ │ ├── css.mdx │ │ │ │ ├── debugging.mdx │ │ │ │ ├── roadmap.mdx │ │ │ │ └── testing.mdx │ │ ├── version-0.21.json │ │ ├── version-0.21 │ │ │ ├── advanced-topics │ │ │ │ ├── how-it-works.mdx │ │ │ │ ├── optimizations.mdx │ │ │ │ └── struct-components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── lifecycle.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ └── refs.mdx │ │ │ ├── concepts │ │ │ │ ├── agents.mdx │ │ │ │ ├── html │ │ │ │ │ ├── components.mdx │ │ │ │ │ ├── elements.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lists.mdx │ │ │ │ │ └── literals-and-expressions.mdx │ │ │ │ └── router.mdx │ │ │ ├── getting-started │ │ │ │ ├── build-a-sample-app.mdx │ │ │ │ └── examples.mdx │ │ │ └── more │ │ │ │ ├── css.mdx │ │ │ │ ├── debugging.mdx │ │ │ │ ├── roadmap.mdx │ │ │ │ └── testing.mdx │ │ ├── version-0.22.json │ │ └── version-0.22 │ │ │ ├── advanced-topics │ │ │ ├── children.mdx │ │ │ ├── how-it-works.mdx │ │ │ ├── immutable.mdx │ │ │ ├── optimizations.mdx │ │ │ ├── portals.mdx │ │ │ ├── server-side-rendering.mdx │ │ │ └── struct-components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── hoc.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lifecycle.mdx │ │ │ │ ├── properties.mdx │ │ │ │ ├── refs.mdx │ │ │ │ └── scope.mdx │ │ │ ├── concepts │ │ │ ├── agents.mdx │ │ │ ├── basic-web-technologies │ │ │ │ ├── css.mdx │ │ │ │ ├── html.mdx │ │ │ │ ├── js.mdx │ │ │ │ ├── wasm-bindgen.mdx │ │ │ │ └── web-sys.mdx │ │ │ ├── contexts.mdx │ │ │ ├── function-components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── children.mdx │ │ │ │ ├── communication.mdx │ │ │ │ ├── generics.mdx │ │ │ │ ├── hooks │ │ │ │ │ ├── custom-hooks.mdx │ │ │ │ │ └── introduction.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── node-refs.mdx │ │ │ │ ├── properties.mdx │ │ │ │ ├── pure-components.mdx │ │ │ │ └── state.mdx │ │ │ ├── html │ │ │ │ ├── classes.mdx │ │ │ │ ├── components.mdx │ │ │ │ ├── conditional-rendering.mdx │ │ │ │ ├── elements.mdx │ │ │ │ ├── events.mdx │ │ │ │ ├── fragments.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lists.mdx │ │ │ │ └── literals-and-expressions.mdx │ │ │ ├── router.mdx │ │ │ └── suspense.mdx │ │ │ ├── getting-started │ │ │ ├── build-a-sample-app.mdx │ │ │ ├── editor-setup.mdx │ │ │ ├── examples.mdx │ │ │ └── introduction.mdx │ │ │ ├── more │ │ │ ├── css.mdx │ │ │ ├── debugging.mdx │ │ │ ├── deployment.mdx │ │ │ ├── roadmap.mdx │ │ │ └── testing.mdx │ │ │ └── tutorial │ │ │ └── index.mdx │ ├── docusaurus-plugin-content-pages │ │ └── index.mdx │ └── docusaurus-theme-classic │ │ ├── footer.json │ │ └── navbar.json ├── zh-Hans │ ├── code.json │ ├── docusaurus-plugin-content-blog │ │ └── options.json │ ├── docusaurus-plugin-content-docs-community │ │ └── current.json │ ├── docusaurus-plugin-content-docs-router │ │ └── current.json │ ├── docusaurus-plugin-content-docs │ │ ├── current.json │ │ ├── current │ │ │ ├── advanced-topics │ │ │ │ ├── children.mdx │ │ │ │ ├── how-it-works.mdx │ │ │ │ ├── immutable.mdx │ │ │ │ ├── optimizations.mdx │ │ │ │ ├── portals.mdx │ │ │ │ ├── server-side-rendering.mdx │ │ │ │ └── struct-components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── hoc.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lifecycle.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ ├── refs.mdx │ │ │ │ │ └── scope.mdx │ │ │ ├── concepts │ │ │ │ ├── agents.mdx │ │ │ │ ├── basic-web-technologies │ │ │ │ │ ├── css.mdx │ │ │ │ │ ├── html.mdx │ │ │ │ │ ├── js.mdx │ │ │ │ │ ├── wasm-bindgen.mdx │ │ │ │ │ └── web-sys.mdx │ │ │ │ ├── contexts.mdx │ │ │ │ ├── function-components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── children.mdx │ │ │ │ │ ├── communication.mdx │ │ │ │ │ ├── generics.mdx │ │ │ │ │ ├── hooks │ │ │ │ │ │ ├── custom-hooks.mdx │ │ │ │ │ │ └── introduction.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── node-refs.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ ├── pure-components.mdx │ │ │ │ │ └── state.mdx │ │ │ │ ├── html │ │ │ │ │ ├── classes.mdx │ │ │ │ │ ├── components.mdx │ │ │ │ │ ├── conditional-rendering.mdx │ │ │ │ │ ├── elements.mdx │ │ │ │ │ ├── events.mdx │ │ │ │ │ ├── fragments.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lists.mdx │ │ │ │ │ └── literals-and-expressions.mdx │ │ │ │ ├── router.mdx │ │ │ │ └── suspense.mdx │ │ │ ├── getting-started │ │ │ │ ├── build-a-sample-app.mdx │ │ │ │ ├── editor-setup.mdx │ │ │ │ ├── examples.mdx │ │ │ │ └── introduction.mdx │ │ │ ├── more │ │ │ │ ├── css.mdx │ │ │ │ ├── debugging.mdx │ │ │ │ ├── deployment.mdx │ │ │ │ ├── roadmap.mdx │ │ │ │ └── testing.mdx │ │ │ └── tutorial │ │ │ │ └── index.mdx │ │ ├── version-0.18.0.json │ │ ├── version-0.18.0 │ │ │ ├── advanced-topics │ │ │ │ ├── how-it-works.mdx │ │ │ │ └── optimizations.mdx │ │ │ ├── concepts │ │ │ │ ├── agents.mdx │ │ │ │ ├── components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── children.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ └── refs.mdx │ │ │ │ ├── html │ │ │ │ │ ├── components.mdx │ │ │ │ │ ├── elements.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lists.mdx │ │ │ │ │ └── literals-and-expressions.mdx │ │ │ │ ├── router.mdx │ │ │ │ └── services │ │ │ │ │ ├── format.mdx │ │ │ │ │ └── introduction.mdx │ │ │ ├── getting-started │ │ │ │ ├── build-a-sample-app.mdx │ │ │ │ ├── choose-web-library.mdx │ │ │ │ ├── examples.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── project-setup │ │ │ │ │ ├── using-cargo-web.mdx │ │ │ │ │ ├── using-trunk.mdx │ │ │ │ │ └── using-wasm-pack.mdx │ │ │ │ └── starter-templates.mdx │ │ │ └── more │ │ │ │ ├── css.mdx │ │ │ │ ├── debugging.mdx │ │ │ │ ├── external-libs.mdx │ │ │ │ ├── roadmap.mdx │ │ │ │ └── testing.mdx │ │ ├── version-0.19.0.json │ │ ├── version-0.19.0 │ │ │ └── concepts │ │ │ │ └── function-components │ │ │ │ └── attribute.mdx │ │ ├── version-0.20.json │ │ ├── version-0.20 │ │ │ ├── advanced-topics │ │ │ │ ├── how-it-works.mdx │ │ │ │ ├── optimizations.mdx │ │ │ │ └── struct-components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── lifecycle.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ └── refs.mdx │ │ │ ├── concepts │ │ │ │ ├── agents.mdx │ │ │ │ ├── function-components │ │ │ │ │ ├── hooks │ │ │ │ │ │ └── custom-hooks.mdx │ │ │ │ │ └── introduction.mdx │ │ │ │ ├── html │ │ │ │ │ ├── components.mdx │ │ │ │ │ ├── elements.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lists.mdx │ │ │ │ │ └── literals-and-expressions.mdx │ │ │ │ └── router.mdx │ │ │ ├── getting-started │ │ │ │ ├── build-a-sample-app.mdx │ │ │ │ └── examples.mdx │ │ │ └── more │ │ │ │ ├── css.mdx │ │ │ │ ├── debugging.mdx │ │ │ │ ├── roadmap.mdx │ │ │ │ └── testing.mdx │ │ ├── version-0.21.json │ │ ├── version-0.21 │ │ │ ├── advanced-topics │ │ │ │ ├── how-it-works.mdx │ │ │ │ ├── optimizations.mdx │ │ │ │ └── struct-components │ │ │ │ │ ├── callbacks.mdx │ │ │ │ │ ├── lifecycle.mdx │ │ │ │ │ ├── properties.mdx │ │ │ │ │ └── refs.mdx │ │ │ ├── concepts │ │ │ │ ├── agents.mdx │ │ │ │ ├── function-components │ │ │ │ │ ├── hooks │ │ │ │ │ │ └── custom-hooks.mdx │ │ │ │ │ └── introduction.mdx │ │ │ │ ├── html │ │ │ │ │ ├── components.mdx │ │ │ │ │ ├── elements.mdx │ │ │ │ │ ├── introduction.mdx │ │ │ │ │ ├── lists.mdx │ │ │ │ │ └── literals-and-expressions.mdx │ │ │ │ └── router.mdx │ │ │ ├── getting-started │ │ │ │ ├── build-a-sample-app.mdx │ │ │ │ └── examples.mdx │ │ │ └── more │ │ │ │ ├── css.mdx │ │ │ │ ├── debugging.mdx │ │ │ │ ├── roadmap.mdx │ │ │ │ └── testing.mdx │ │ ├── version-0.22.json │ │ └── version-0.22 │ │ │ ├── advanced-topics │ │ │ ├── children.mdx │ │ │ ├── how-it-works.mdx │ │ │ ├── immutable.mdx │ │ │ ├── optimizations.mdx │ │ │ ├── portals.mdx │ │ │ ├── server-side-rendering.mdx │ │ │ └── struct-components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── hoc.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lifecycle.mdx │ │ │ │ ├── properties.mdx │ │ │ │ ├── refs.mdx │ │ │ │ └── scope.mdx │ │ │ ├── concepts │ │ │ ├── agents.mdx │ │ │ ├── basic-web-technologies │ │ │ │ ├── css.mdx │ │ │ │ ├── html.mdx │ │ │ │ ├── js.mdx │ │ │ │ ├── wasm-bindgen.mdx │ │ │ │ └── web-sys.mdx │ │ │ ├── contexts.mdx │ │ │ ├── function-components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── children.mdx │ │ │ │ ├── communication.mdx │ │ │ │ ├── generics.mdx │ │ │ │ ├── hooks │ │ │ │ │ ├── custom-hooks.mdx │ │ │ │ │ └── introduction.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── node-refs.mdx │ │ │ │ ├── properties.mdx │ │ │ │ ├── pure-components.mdx │ │ │ │ └── state.mdx │ │ │ ├── html │ │ │ │ ├── classes.mdx │ │ │ │ ├── components.mdx │ │ │ │ ├── conditional-rendering.mdx │ │ │ │ ├── elements.mdx │ │ │ │ ├── events.mdx │ │ │ │ ├── fragments.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lists.mdx │ │ │ │ └── literals-and-expressions.mdx │ │ │ ├── router.mdx │ │ │ └── suspense.mdx │ │ │ ├── getting-started │ │ │ ├── build-a-sample-app.mdx │ │ │ ├── editor-setup.mdx │ │ │ ├── examples.mdx │ │ │ └── introduction.mdx │ │ │ ├── more │ │ │ ├── css.mdx │ │ │ ├── debugging.mdx │ │ │ ├── deployment.mdx │ │ │ ├── roadmap.mdx │ │ │ └── testing.mdx │ │ │ └── tutorial │ │ │ └── index.mdx │ ├── docusaurus-plugin-content-pages │ │ └── index.mdx │ └── docusaurus-theme-classic │ │ ├── footer.json │ │ └── navbar.json └── zh-Hant │ ├── code.json │ ├── docusaurus-plugin-content-blog │ └── options.json │ ├── docusaurus-plugin-content-docs-community │ └── current.json │ ├── docusaurus-plugin-content-docs-router │ └── current.json │ ├── docusaurus-plugin-content-docs │ ├── current.json │ ├── current │ │ ├── advanced-topics │ │ │ ├── children.mdx │ │ │ ├── how-it-works.mdx │ │ │ ├── immutable.mdx │ │ │ ├── optimizations.mdx │ │ │ ├── portals.mdx │ │ │ ├── server-side-rendering.mdx │ │ │ └── struct-components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── hoc.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lifecycle.mdx │ │ │ │ ├── properties.mdx │ │ │ │ ├── refs.mdx │ │ │ │ └── scope.mdx │ │ ├── concepts │ │ │ ├── agents.mdx │ │ │ ├── basic-web-technologies │ │ │ │ ├── css.mdx │ │ │ │ ├── html.mdx │ │ │ │ ├── js.mdx │ │ │ │ ├── wasm-bindgen.mdx │ │ │ │ └── web-sys.mdx │ │ │ ├── contexts.mdx │ │ │ ├── function-components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── children.mdx │ │ │ │ ├── communication.mdx │ │ │ │ ├── generics.mdx │ │ │ │ ├── hooks │ │ │ │ │ ├── custom-hooks.mdx │ │ │ │ │ └── introduction.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── node-refs.mdx │ │ │ │ ├── properties.mdx │ │ │ │ ├── pure-components.mdx │ │ │ │ └── state.mdx │ │ │ ├── html │ │ │ │ ├── classes.mdx │ │ │ │ ├── components.mdx │ │ │ │ ├── conditional-rendering.mdx │ │ │ │ ├── elements.mdx │ │ │ │ ├── events.mdx │ │ │ │ ├── fragments.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lists.mdx │ │ │ │ └── literals-and-expressions.mdx │ │ │ ├── router.mdx │ │ │ └── suspense.mdx │ │ ├── getting-started │ │ │ ├── build-a-sample-app.mdx │ │ │ ├── editor-setup.mdx │ │ │ ├── examples.mdx │ │ │ └── introduction.mdx │ │ ├── more │ │ │ ├── css.mdx │ │ │ ├── debugging.mdx │ │ │ ├── deployment.mdx │ │ │ ├── roadmap.mdx │ │ │ └── testing.mdx │ │ └── tutorial │ │ │ └── index.mdx │ ├── version-0.18.0.json │ ├── version-0.18.0 │ │ ├── advanced-topics │ │ │ ├── how-it-works.mdx │ │ │ └── optimizations.mdx │ │ ├── concepts │ │ │ ├── agents.mdx │ │ │ ├── components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── properties.mdx │ │ │ │ └── refs.mdx │ │ │ ├── html │ │ │ │ ├── components.mdx │ │ │ │ ├── elements.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lists.mdx │ │ │ │ └── literals-and-expressions.mdx │ │ │ ├── router.mdx │ │ │ └── services │ │ │ │ ├── format.mdx │ │ │ │ └── introduction.mdx │ │ ├── getting-started │ │ │ ├── build-a-sample-app.mdx │ │ │ ├── choose-web-library.mdx │ │ │ ├── examples.mdx │ │ │ ├── introduction.mdx │ │ │ ├── project-setup │ │ │ │ ├── using-cargo-web.mdx │ │ │ │ └── using-wasm-pack.mdx │ │ │ └── starter-templates.mdx │ │ └── more │ │ │ ├── css.mdx │ │ │ ├── debugging.mdx │ │ │ ├── external-libs.mdx │ │ │ ├── roadmap.mdx │ │ │ └── testing.mdx │ ├── version-0.19.0.json │ ├── version-0.20.json │ ├── version-0.20 │ │ ├── advanced-topics │ │ │ ├── how-it-works.mdx │ │ │ ├── optimizations.mdx │ │ │ └── struct-components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── lifecycle.mdx │ │ │ │ ├── properties.mdx │ │ │ │ └── refs.mdx │ │ ├── concepts │ │ │ ├── agents.mdx │ │ │ ├── html │ │ │ │ ├── components.mdx │ │ │ │ ├── elements.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lists.mdx │ │ │ │ └── literals-and-expressions.mdx │ │ │ └── router.mdx │ │ ├── getting-started │ │ │ ├── build-a-sample-app.mdx │ │ │ └── examples.mdx │ │ └── more │ │ │ ├── css.mdx │ │ │ ├── debugging.mdx │ │ │ ├── roadmap.mdx │ │ │ └── testing.mdx │ ├── version-0.21.json │ ├── version-0.21 │ │ ├── advanced-topics │ │ │ ├── how-it-works.mdx │ │ │ ├── optimizations.mdx │ │ │ └── struct-components │ │ │ │ ├── callbacks.mdx │ │ │ │ ├── lifecycle.mdx │ │ │ │ ├── properties.mdx │ │ │ │ └── refs.mdx │ │ ├── concepts │ │ │ ├── agents.mdx │ │ │ ├── html │ │ │ │ ├── components.mdx │ │ │ │ ├── elements.mdx │ │ │ │ ├── introduction.mdx │ │ │ │ ├── lists.mdx │ │ │ │ └── literals-and-expressions.mdx │ │ │ └── router.mdx │ │ ├── getting-started │ │ │ ├── build-a-sample-app.mdx │ │ │ └── examples.mdx │ │ └── more │ │ │ ├── css.mdx │ │ │ ├── debugging.mdx │ │ │ ├── roadmap.mdx │ │ │ └── testing.mdx │ ├── version-0.22.json │ └── version-0.22 │ │ ├── advanced-topics │ │ ├── children.mdx │ │ ├── how-it-works.mdx │ │ ├── immutable.mdx │ │ ├── optimizations.mdx │ │ ├── portals.mdx │ │ ├── server-side-rendering.mdx │ │ └── struct-components │ │ │ ├── callbacks.mdx │ │ │ ├── hoc.mdx │ │ │ ├── introduction.mdx │ │ │ ├── lifecycle.mdx │ │ │ ├── properties.mdx │ │ │ ├── refs.mdx │ │ │ └── scope.mdx │ │ ├── concepts │ │ ├── agents.mdx │ │ ├── basic-web-technologies │ │ │ ├── css.mdx │ │ │ ├── html.mdx │ │ │ ├── js.mdx │ │ │ ├── wasm-bindgen.mdx │ │ │ └── web-sys.mdx │ │ ├── contexts.mdx │ │ ├── function-components │ │ │ ├── callbacks.mdx │ │ │ ├── children.mdx │ │ │ ├── communication.mdx │ │ │ ├── generics.mdx │ │ │ ├── hooks │ │ │ │ ├── custom-hooks.mdx │ │ │ │ └── introduction.mdx │ │ │ ├── introduction.mdx │ │ │ ├── node-refs.mdx │ │ │ ├── properties.mdx │ │ │ ├── pure-components.mdx │ │ │ └── state.mdx │ │ ├── html │ │ │ ├── classes.mdx │ │ │ ├── components.mdx │ │ │ ├── conditional-rendering.mdx │ │ │ ├── elements.mdx │ │ │ ├── events.mdx │ │ │ ├── fragments.mdx │ │ │ ├── introduction.mdx │ │ │ ├── lists.mdx │ │ │ └── literals-and-expressions.mdx │ │ ├── router.mdx │ │ └── suspense.mdx │ │ ├── getting-started │ │ ├── build-a-sample-app.mdx │ │ ├── editor-setup.mdx │ │ ├── examples.mdx │ │ └── introduction.mdx │ │ ├── more │ │ ├── css.mdx │ │ ├── debugging.mdx │ │ ├── deployment.mdx │ │ ├── roadmap.mdx │ │ └── testing.mdx │ │ └── tutorial │ │ └── index.mdx │ ├── docusaurus-plugin-content-pages │ └── index.mdx │ └── docusaurus-theme-classic │ ├── footer.json │ └── navbar.json ├── mdx-jetbrains.jpg ├── package-lock.json ├── package.json ├── sidebars ├── community.js └── docs.js ├── src ├── constants.js ├── css │ └── custom.css ├── pages │ ├── index.module.scss │ └── index.tsx └── theme │ └── NavbarItem │ └── DefaultNavbarItem.tsx ├── static ├── .nojekyll ├── img │ ├── agent-lifecycle-dark.svg │ ├── agent-lifecycle-light.svg │ ├── logo.png │ ├── logo.svg │ ├── nested-router-dark.svg │ ├── nested-router-light.svg │ ├── router-deserialization-failure-behavior.gif │ └── tutorial_application_screenshot.png └── tutorial │ └── data.json ├── tsconfig.json ├── versioned_docs ├── version-0.18.0 │ ├── advanced-topics │ │ ├── how-it-works.mdx │ │ └── optimizations.mdx │ ├── concepts │ │ ├── agents.mdx │ │ ├── components │ │ │ ├── callbacks.mdx │ │ │ ├── children.mdx │ │ │ ├── introduction.mdx │ │ │ ├── properties.mdx │ │ │ └── refs.mdx │ │ ├── html │ │ │ ├── classes.mdx │ │ │ ├── components.mdx │ │ │ ├── elements.mdx │ │ │ ├── events.mdx │ │ │ ├── introduction.mdx │ │ │ ├── lists.mdx │ │ │ └── literals-and-expressions.mdx │ │ ├── router.mdx │ │ ├── services │ │ │ ├── fetch.mdx │ │ │ ├── format.mdx │ │ │ └── introduction.mdx │ │ └── wasm-bindgen │ │ │ ├── wasm-bindgen.mdx │ │ │ └── web-sys.mdx │ ├── getting-started │ │ ├── build-a-sample-app.mdx │ │ ├── choose-web-library.mdx │ │ ├── examples.mdx │ │ ├── introduction.mdx │ │ ├── project-setup │ │ │ ├── using-cargo-web.mdx │ │ │ ├── using-trunk.mdx │ │ │ └── using-wasm-pack.mdx │ │ └── starter-templates.mdx │ └── more │ │ ├── css.mdx │ │ ├── debugging.mdx │ │ ├── external-libs.mdx │ │ ├── roadmap.mdx │ │ └── testing.mdx ├── version-0.19.0 │ ├── advanced-topics │ │ ├── how-it-works.mdx │ │ ├── optimizations.mdx │ │ └── portals.mdx │ ├── concepts │ │ ├── agents.mdx │ │ ├── components │ │ │ ├── callbacks.mdx │ │ │ ├── children.mdx │ │ │ ├── introduction.mdx │ │ │ ├── properties.mdx │ │ │ ├── refs.mdx │ │ │ └── scope.mdx │ │ ├── contexts.mdx │ │ ├── function-components │ │ │ ├── attribute.mdx │ │ │ ├── custom-hooks.mdx │ │ │ ├── introduction.mdx │ │ │ └── pre-defined-hooks.mdx │ │ ├── html │ │ │ ├── classes.mdx │ │ │ ├── components.mdx │ │ │ ├── elements.mdx │ │ │ ├── events.mdx │ │ │ ├── fragments.mdx │ │ │ ├── introduction.mdx │ │ │ ├── lists.mdx │ │ │ └── literals-and-expressions.mdx │ │ ├── router.mdx │ │ └── wasm-bindgen │ │ │ ├── introduction.mdx │ │ │ └── web-sys.mdx │ ├── getting-started │ │ ├── build-a-sample-app.mdx │ │ ├── examples.mdx │ │ ├── introduction.mdx │ │ ├── project-setup │ │ │ ├── using-trunk.mdx │ │ │ └── using-wasm-pack.mdx │ │ └── starter-templates.mdx │ ├── migration-guides │ │ ├── yew-agent │ │ │ └── from-0_0_0-to-0_1_0.mdx │ │ ├── yew-router │ │ │ └── from-0_15_0-to-0_16_0.mdx │ │ └── yew │ │ │ └── from-0_18_0-to-0_19_0.mdx │ ├── more │ │ ├── css.mdx │ │ ├── debugging.mdx │ │ ├── development-tips.mdx │ │ ├── external-libs.mdx │ │ ├── roadmap.mdx │ │ ├── testing.mdx │ │ └── wasm-build-tools.mdx │ └── tutorial │ │ └── index.mdx ├── version-0.20 │ ├── advanced-topics │ │ ├── children.mdx │ │ ├── how-it-works.mdx │ │ ├── immutable.mdx │ │ ├── optimizations.mdx │ │ ├── portals.mdx │ │ ├── server-side-rendering.md │ │ └── struct-components │ │ │ ├── callbacks.mdx │ │ │ ├── hoc.mdx │ │ │ ├── introduction.mdx │ │ │ ├── lifecycle.mdx │ │ │ ├── properties.mdx │ │ │ ├── refs.mdx │ │ │ └── scope.mdx │ ├── concepts │ │ ├── agents.mdx │ │ ├── basic-web-technologies │ │ │ ├── css.mdx │ │ │ ├── html.mdx │ │ │ ├── js.mdx │ │ │ ├── wasm-bindgen.mdx │ │ │ └── web-sys.mdx │ │ ├── contexts.mdx │ │ ├── function-components │ │ │ ├── callbacks.mdx │ │ │ ├── children.mdx │ │ │ ├── communication.mdx │ │ │ ├── generics.mdx │ │ │ ├── hooks │ │ │ │ ├── custom-hooks.mdx │ │ │ │ └── introduction.mdx │ │ │ ├── introduction.mdx │ │ │ ├── node-refs.mdx │ │ │ ├── properties.mdx │ │ │ ├── pure-components.mdx │ │ │ └── state.mdx │ │ ├── html │ │ │ ├── classes.mdx │ │ │ ├── components.mdx │ │ │ ├── conditional-rendering.mdx │ │ │ ├── elements.mdx │ │ │ ├── events.mdx │ │ │ ├── fragments.mdx │ │ │ ├── introduction.mdx │ │ │ ├── lists.mdx │ │ │ └── literals-and-expressions.mdx │ │ ├── router.mdx │ │ └── suspense.mdx │ ├── getting-started │ │ ├── build-a-sample-app.mdx │ │ ├── editor-setup.mdx │ │ ├── examples.mdx │ │ └── introduction.mdx │ ├── migration-guides │ │ ├── yew-agent │ │ │ ├── from-0_0_0-to-0_1_0.mdx │ │ │ └── from-0_1_0-to-0_2_0.mdx │ │ ├── yew-router │ │ │ ├── from-0_15_0-to-0_16_0.mdx │ │ │ └── from-0_16_0-to-0_17_0.mdx │ │ └── yew │ │ │ ├── from-0_18_0-to-0_19_0.mdx │ │ │ └── from-0_19_0-to-0_20_0.mdx │ ├── more │ │ ├── css.mdx │ │ ├── debugging.mdx │ │ ├── deployment.mdx │ │ ├── roadmap.mdx │ │ └── testing.mdx │ └── tutorial │ │ └── index.mdx ├── version-0.21 │ ├── advanced-topics │ │ ├── children.mdx │ │ ├── how-it-works.mdx │ │ ├── immutable.mdx │ │ ├── optimizations.mdx │ │ ├── portals.mdx │ │ ├── server-side-rendering.md │ │ └── struct-components │ │ │ ├── callbacks.mdx │ │ │ ├── hoc.mdx │ │ │ ├── introduction.mdx │ │ │ ├── lifecycle.mdx │ │ │ ├── properties.mdx │ │ │ ├── refs.mdx │ │ │ └── scope.mdx │ ├── concepts │ │ ├── agents.mdx │ │ ├── basic-web-technologies │ │ │ ├── css.mdx │ │ │ ├── html.mdx │ │ │ ├── js.mdx │ │ │ ├── wasm-bindgen.mdx │ │ │ └── web-sys.mdx │ │ ├── contexts.mdx │ │ ├── function-components │ │ │ ├── callbacks.mdx │ │ │ ├── children.mdx │ │ │ ├── communication.mdx │ │ │ ├── generics.mdx │ │ │ ├── hooks │ │ │ │ ├── custom-hooks.mdx │ │ │ │ └── introduction.mdx │ │ │ ├── introduction.mdx │ │ │ ├── node-refs.mdx │ │ │ ├── properties.mdx │ │ │ ├── pure-components.mdx │ │ │ └── state.mdx │ │ ├── html │ │ │ ├── classes.mdx │ │ │ ├── components.mdx │ │ │ ├── conditional-rendering.mdx │ │ │ ├── elements.mdx │ │ │ ├── events.mdx │ │ │ ├── fragments.mdx │ │ │ ├── introduction.mdx │ │ │ ├── lists.mdx │ │ │ └── literals-and-expressions.mdx │ │ ├── router.mdx │ │ └── suspense.mdx │ ├── getting-started │ │ ├── build-a-sample-app.mdx │ │ ├── editor-setup.mdx │ │ ├── examples.mdx │ │ └── introduction.mdx │ ├── migration-guides │ │ ├── yew-agent │ │ │ ├── from-0_0_0-to-0_1_0.mdx │ │ │ └── from-0_1_0-to-0_2_0.mdx │ │ ├── yew-router │ │ │ ├── from-0_15_0-to-0_16_0.mdx │ │ │ └── from-0_16_0-to-0_17_0.mdx │ │ └── yew │ │ │ ├── from-0_18_0-to-0_19_0.mdx │ │ │ ├── from-0_19_0-to-0_20_0.mdx │ │ │ ├── from-0_20_0-to-0_21_0.mdx │ │ │ └── from-0_20_0-to-next.mdx │ ├── more │ │ ├── css.mdx │ │ ├── debugging.mdx │ │ ├── deployment.mdx │ │ ├── roadmap.mdx │ │ └── testing.mdx │ └── tutorial │ │ └── index.mdx └── version-0.22 │ ├── advanced-topics │ ├── children.mdx │ ├── how-it-works.mdx │ ├── immutable.mdx │ ├── optimizations.mdx │ ├── portals.mdx │ ├── server-side-rendering.mdx │ └── struct-components │ │ ├── callbacks.mdx │ │ ├── hoc.mdx │ │ ├── introduction.mdx │ │ ├── lifecycle.mdx │ │ ├── properties.mdx │ │ ├── refs.mdx │ │ └── scope.mdx │ ├── concepts │ ├── agents.mdx │ ├── basic-web-technologies │ │ ├── css.mdx │ │ ├── html.mdx │ │ ├── js.mdx │ │ ├── wasm-bindgen.mdx │ │ └── web-sys.mdx │ ├── contexts.mdx │ ├── function-components │ │ ├── callbacks.mdx │ │ ├── children.mdx │ │ ├── communication.mdx │ │ ├── generics.mdx │ │ ├── hooks │ │ │ ├── custom-hooks.mdx │ │ │ └── introduction.mdx │ │ ├── introduction.mdx │ │ ├── node-refs.mdx │ │ ├── properties.mdx │ │ ├── pure-components.mdx │ │ └── state.mdx │ ├── html │ │ ├── classes.mdx │ │ ├── components.mdx │ │ ├── conditional-rendering.mdx │ │ ├── elements.mdx │ │ ├── events.mdx │ │ ├── fragments.mdx │ │ ├── introduction.mdx │ │ ├── lists.mdx │ │ └── literals-and-expressions.mdx │ ├── router.mdx │ └── suspense.mdx │ ├── getting-started │ ├── build-a-sample-app.mdx │ ├── editor-setup.mdx │ ├── examples.mdx │ └── introduction.mdx │ ├── migration-guides │ ├── yew-agent │ │ ├── from-0_0_0-to-0_1_0.mdx │ │ └── from-0_1_0-to-0_2_0.mdx │ ├── yew-router │ │ ├── from-0_15_0-to-0_16_0.mdx │ │ └── from-0_16_0-to-0_17_0.mdx │ └── yew │ │ ├── from-0_18_0-to-0_19_0.mdx │ │ ├── from-0_19_0-to-0_20_0.mdx │ │ └── from-0_20_0-to-0_21_0.mdx │ ├── more │ ├── css.mdx │ ├── debugging.mdx │ ├── deployment.mdx │ ├── roadmap.mdx │ └── testing.mdx │ └── tutorial │ └── index.mdx ├── versioned_sidebars ├── version-0.18.0-sidebars.json ├── version-0.19.0-sidebars.json ├── version-0.20-sidebars.json ├── version-0.21-sidebars.json └── version-0.22-sidebars.json ├── versions.json └── write-translations.js /.cargo/config.toml: -------------------------------------------------------------------------------- 1 | [target.'cfg(all(target_arch = "wasm32", not(target_os = "wasi")))'] 2 | runner = 'wasm-bindgen-test-runner' 3 | 4 | [target.'cfg(all(target_arch = "wasm32", target_os = "wasi"))'] 5 | runner = 'wasmtime -W unknown-imports-trap=y' 6 | 7 | # This section needs to be last. 8 | # GitHub Actions modifies this section. 9 | [unstable] 10 | doctest-xcompile = true 11 | -------------------------------------------------------------------------------- /.firebaserc: -------------------------------------------------------------------------------- 1 | { 2 | "projects": { 3 | "default": "yew-rs" 4 | }, 5 | "targets": { 6 | "yew-rs": { 7 | "hosting": { 8 | "website": [ 9 | "yew-rs" 10 | ], 11 | "examples": [ 12 | "yew-rs-examples" 13 | ], 14 | "api": [ 15 | "yew-rs-api" 16 | ] 17 | } 18 | } 19 | } 20 | } -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | *.mdx linguist-detectable=false 2 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] 4 | patreon: # Replace with a single Patreon username 5 | open_collective: yew 6 | ko_fi: # Replace with a single Ko-fi username 7 | tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel 8 | community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry 9 | liberapay: # Replace with a single Liberapay username 10 | issuehunt: # Replace with a single IssueHunt username 11 | otechie: # Replace with a single Otechie username 12 | custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2'] 13 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/config.yml: -------------------------------------------------------------------------------- 1 | blank_issues_enabled: true 2 | contact_links: 3 | - name: Ask question 4 | url: https://discord.gg/VQck8X4 5 | about: Looking for a quick answer? Ask the community! 6 | - name: Feature proposal 7 | url: https://github.com/yewstack/yew/discussions/categories/ideas 8 | about: Start a discussion for a feature you would like to see 9 | - name: Issue with the Playground? 10 | url: https://github.com/yewstack/yew-playground/issues/new 11 | about: Open an issue on the yew-playground repository 12 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | #### Description 2 | 3 | 4 | 5 | Fixes #0000 6 | 7 | #### Checklist 8 | 9 | 10 | 11 | - [ ] I have reviewed my own code 12 | - [ ] I have added tests 13 | 14 | 15 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | updates: 3 | - package-ecosystem: "cargo" 4 | directory: "/" 5 | schedule: 6 | interval: "weekly" 7 | day: "friday" 8 | open-pull-requests-limit: 2 9 | groups: 10 | cargo-deps: 11 | patterns: 12 | - "*" 13 | 14 | - package-ecosystem: "npm" 15 | directory: "/website" 16 | schedule: 17 | interval: "monthly" 18 | target-branch: "master" 19 | groups: 20 | website-deps: 21 | patterns: 22 | - "*" 23 | 24 | - package-ecosystem: "github-actions" 25 | directory: "/" 26 | schedule: 27 | interval: "monthly" 28 | target-branch: "master" 29 | -------------------------------------------------------------------------------- /.github/workflows/fmt.yml: -------------------------------------------------------------------------------- 1 | name: cargo fmt 2 | on: 3 | pull_request: 4 | paths: 5 | - "**/*.rs" 6 | push: 7 | branches: [master] 8 | paths: 9 | - "**/*.rs" 10 | 11 | jobs: 12 | format: 13 | name: cargo fmt 14 | runs-on: ubuntu-latest 15 | steps: 16 | - uses: actions/checkout@v4 17 | 18 | - name: Setup toolchain 19 | uses: dtolnay/rust-toolchain@master 20 | with: 21 | toolchain: nightly 22 | components: rustfmt 23 | 24 | - name: Run fmt 25 | run: cargo +nightly fmt --all -- --check --unstable-features 26 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | target/ 2 | dist/ 3 | 4 | # backup files generated by rustfmt 5 | **/*.rs.bk 6 | 7 | # editor config files and directories 8 | *.iml 9 | /.idea/ 10 | /.vscode/ 11 | -------------------------------------------------------------------------------- /Cargo.toml: -------------------------------------------------------------------------------- 1 | [workspace] 2 | members = [ 3 | "packages/*", 4 | "tools/*", 5 | "examples/*", 6 | ] 7 | default-members = [ 8 | "packages/*", 9 | ] 10 | resolver = "2" 11 | 12 | [profile.release] 13 | lto = true 14 | codegen-units = 1 15 | panic = "abort" 16 | opt-level = "z" 17 | 18 | [profile.bench] 19 | lto = true 20 | codegen-units = 1 21 | opt-level = 3 22 | 23 | [workspace.lints.rust] 24 | unexpected_cfgs = { level = "warn", check-cfg = [ 25 | "cfg(documenting)", 26 | "cfg(verbose_tests)", 27 | "cfg(yew_lints)", 28 | "cfg(nightly_yew)", 29 | "cfg(wasm_bindgen_unstable_test_coverage)" 30 | ]} 31 | -------------------------------------------------------------------------------- /api-docs/.gitignore: -------------------------------------------------------------------------------- 1 | dist 2 | -------------------------------------------------------------------------------- /api-docs/before-content.html: -------------------------------------------------------------------------------- 1 |
2 |
This is unreleased documentation for Yew Next version.
3 |
For up-to-date documentation, see the latest version on docs.rs.
4 |
5 | -------------------------------------------------------------------------------- /api-docs/styles.css: -------------------------------------------------------------------------------- 1 | #unreleased-version-header { 2 | background-color: rgb(200, 237, 248); 3 | z-index: 400; 4 | position: absolute; 5 | left: 0; 6 | top: 0; 7 | right: 0; 8 | height: 70px; 9 | padding-top: 10px; 10 | padding-bottom: 10px; 11 | text-align: center; 12 | font-family: sans-serif; 13 | box-shadow: 0 0 5px 0 rgb(100, 100, 100); 14 | } 15 | 16 | @media (prefers-color-scheme: dark) { 17 | #unreleased-version-header { 18 | background-color: rgb(32, 43, 57); 19 | box-shadow: 0 0 5px 0 black; 20 | } 21 | } 22 | 23 | body { 24 | padding-top: 70px !important; 25 | } 26 | -------------------------------------------------------------------------------- /ci/install-wasm-bindgen-cli.sh: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | if [ ! -f "Cargo.lock" ]; then 3 | cargo fetch 4 | fi 5 | 6 | VERSION=$(cargo pkgid --frozen wasm-bindgen | cut -d ":" -f 3) 7 | 8 | # Cargo decided to change syntax after 1.61 9 | if [ "$VERSION" = "" ]; then 10 | VERSION=$(cargo pkgid --frozen wasm-bindgen | cut -d "@" -f 2) 11 | fi 12 | 13 | if [ "$(wasm-bindgen --version)" != "wasm-bindgen $VERSION" ]; then 14 | cargo +stable install --version "$VERSION" wasm-bindgen-cli --force 15 | fi 16 | -------------------------------------------------------------------------------- /examples/.gitignore: -------------------------------------------------------------------------------- 1 | # trunk output 2 | dist/ 3 | -------------------------------------------------------------------------------- /examples/async_clock/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "async_clock" 3 | version = "0.0.1" 4 | authors = ["Marcel Ibes "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | chrono = "0.4" 11 | futures = "0.3" 12 | gloo-net = "0.6" 13 | -------------------------------------------------------------------------------- /examples/async_clock/README.md: -------------------------------------------------------------------------------- 1 | # Asynchronous coding in Yew 2 | 3 | An example of using asynchronous tasks in a component. This example creates a clock in the background and 4 | continuously awaits clock-ticks. When the clock updates the new time is sent to the UI component to display. 5 | In parallel it fetches online jokes to make the clock more entertaining to watch. 6 | 7 | Its main purpose is to demonstrate various ways of using async code in a yew component. It uses the following async 8 | features: 9 | - send_future 10 | - send_stream 11 | - spawn_local 12 | - mpsc::unbounded channels 13 | 14 | ## Running 15 | 16 | Run this application with the trunk development server: 17 | 18 | ```bash 19 | trunk serve --open 20 | ``` -------------------------------------------------------------------------------- /examples/async_clock/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/async_clock/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Async Examples 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/boids/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "boids" 3 | version = "0.1.0" 4 | authors = ["motoki saito "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html 9 | [dependencies] 10 | anyhow = "1.0" 11 | getrandom = { version = "0.3", features = ["wasm_js"] } 12 | rand = "0.9" 13 | serde = { version = "1.0", features = ["derive"] } 14 | yew = { path = "../../packages/yew", features = ["csr"] } 15 | gloo = "0.11" 16 | 17 | [dependencies.web-sys] 18 | version = "0.3" 19 | features = [ 20 | "HtmlInputElement", 21 | ] 22 | -------------------------------------------------------------------------------- /examples/boids/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/boids/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Boids 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/communication_child_to_parent/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "communication_child_to_parent" 3 | version = "0.0.1" 4 | authors = ["Marcel Ibes "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | -------------------------------------------------------------------------------- /examples/communication_child_to_parent/README.md: -------------------------------------------------------------------------------- 1 | # Child-to-Parent Example 2 | 3 | A simple example of updating a parent from two children using a callback mechanism. 4 | 5 | ## Running 6 | 7 | Run this application with the trunk development server: 8 | 9 | ```bash 10 | trunk serve --open 11 | ``` 12 | -------------------------------------------------------------------------------- /examples/communication_child_to_parent/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/communication_child_to_parent/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Child-to-Parent Communication 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/communication_child_to_parent/src/main.rs: -------------------------------------------------------------------------------- 1 | use child::Child; 2 | use parent::Parent; 3 | use yew::{html, AttrValue, Callback, Component, Context, Html, Properties}; 4 | 5 | mod child; 6 | mod parent; 7 | 8 | fn main() { 9 | yew::Renderer::::new().render(); 10 | } 11 | -------------------------------------------------------------------------------- /examples/communication_grandchild_with_grandparent/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "communication_grandchild_with_grandparent" 3 | version = "0.0.1" 4 | authors = ["Marcel Ibes "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | -------------------------------------------------------------------------------- /examples/communication_grandchild_with_grandparent/README.md: -------------------------------------------------------------------------------- 1 | # Grandchild-with-Grandparent Example 2 | 3 | A simple example of updating a grandparent component from two grandchildren using a callback passed down using the context API. 4 | The grandchildren themselves also update whenever the grandparent updates the shared state. 5 | 6 | ## Running 7 | 8 | Run this application with the trunk development server: 9 | 10 | ```bash 11 | trunk serve --open 12 | ``` -------------------------------------------------------------------------------- /examples/communication_grandchild_with_grandparent/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/communication_grandchild_with_grandparent/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Grandchild-to-Grandparent Communication 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/communication_grandchild_with_grandparent/src/parent.rs: -------------------------------------------------------------------------------- 1 | use super::*; 2 | 3 | /// The `Parent` component is the parent of the `Child` component. It has no logic, and is here to 4 | /// show there is no direct relation between grandchild and grandparent. 5 | #[function_component] 6 | pub fn Parent() -> Html { 7 | html! { 8 |
9 |
10 | { "Parent" } 11 |
12 |
13 | 14 | 15 |
16 |
17 | } 18 | } 19 | -------------------------------------------------------------------------------- /examples/communication_grandparent_to_grandchild/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "communication_grandparent_to_grandchild" 3 | version = "0.0.1" 4 | authors = ["Marcel Ibes "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | -------------------------------------------------------------------------------- /examples/communication_grandparent_to_grandchild/README.md: -------------------------------------------------------------------------------- 1 | # Grandparent-to-Grandchild Example 2 | 3 | A simple example of updating a grandchild component from a grandparent using a shared state through the ContextProvider. 4 | 5 | ## Running 6 | 7 | Run this application with the trunk development server: 8 | 9 | ```bash 10 | trunk serve --open 11 | ``` -------------------------------------------------------------------------------- /examples/communication_grandparent_to_grandchild/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/communication_grandparent_to_grandchild/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Granparent-to-GrandChild Communication 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/communication_grandparent_to_grandchild/src/main.rs: -------------------------------------------------------------------------------- 1 | use std::rc::Rc; 2 | 3 | use child::Child; 4 | use grandparent::GrandParent; 5 | use parent::Parent; 6 | 7 | mod child; 8 | mod grandparent; 9 | mod parent; 10 | 11 | use yew::{function_component, html, Component, Context, ContextHandle, ContextProvider, Html}; 12 | 13 | /// This is the shared state between the parent and child components. 14 | #[derive(Clone, Eq, PartialEq)] 15 | pub struct AppState { 16 | /// The total number of clicks received. 17 | total_clicks: u32, 18 | } 19 | 20 | fn main() { 21 | yew::Renderer::::new().render(); 22 | } 23 | -------------------------------------------------------------------------------- /examples/communication_grandparent_to_grandchild/src/parent.rs: -------------------------------------------------------------------------------- 1 | use super::*; 2 | 3 | /// The `Parent` component is the parent of the `Child` component. It has no logic, and is here to 4 | /// show there is no direct relation between grandchild and grandparent. 5 | #[function_component] 6 | pub fn Parent() -> Html { 7 | html! { 8 |
9 |
10 | { "Parent" } 11 |
12 |
13 | 14 |
15 |
16 | } 17 | } 18 | -------------------------------------------------------------------------------- /examples/communication_parent_to_child/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "communication_parent_to_child" 3 | version = "0.0.1" 4 | authors = ["Marcel Ibes "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | -------------------------------------------------------------------------------- /examples/communication_parent_to_child/README.md: -------------------------------------------------------------------------------- 1 | # Parent-to-Child Example 2 | 3 | A simple example of updating a child from a parent using properties 4 | 5 | ## Running 6 | 7 | Run this application with the trunk development server: 8 | 9 | ```bash 10 | trunk serve --open 11 | ``` -------------------------------------------------------------------------------- /examples/communication_parent_to_child/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/communication_parent_to_child/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Parent-to-Child Communication 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/communication_parent_to_child/src/main.rs: -------------------------------------------------------------------------------- 1 | use child::Child; 2 | use parent::Parent; 3 | use yew::{html, Component, Context, Html, Properties}; 4 | 5 | mod child; 6 | mod parent; 7 | 8 | fn main() { 9 | yew::Renderer::::new().render(); 10 | } 11 | -------------------------------------------------------------------------------- /examples/contexts/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "contexts" 3 | version = "0.1.0" 4 | edition = "2021" 5 | license = "MIT OR Apache-2.0" 6 | 7 | [dependencies] 8 | yew = { path = "../../packages/yew", features = ["csr"] } 9 | yew-agent = { path = "../../packages/yew-agent" } 10 | -------------------------------------------------------------------------------- /examples/contexts/README.md: -------------------------------------------------------------------------------- 1 | # Context Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fcontexts)](https://examples.yew.rs/contexts) 4 | 5 | This is currently a technical demonstration of Context API. 6 | 7 | ## Concepts 8 | 9 | The example has two components, which communicates through a context 10 | as opposed to the traditional method using component links. 11 | 12 | ## Running 13 | 14 | Run this application with the trunk development server: 15 | 16 | ```bash 17 | trunk serve --open 18 | ``` -------------------------------------------------------------------------------- /examples/contexts/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/contexts/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Context 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/contexts/src/producer.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use super::msg_ctx::MessageContext; 4 | 5 | #[function_component] 6 | pub fn Producer() -> Html { 7 | let msg_ctx = use_context::().unwrap(); 8 | 9 | html! { 10 | 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /examples/contexts/src/subscriber.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | use super::msg_ctx::MessageContext; 4 | 5 | #[function_component] 6 | pub fn Subscriber() -> Html { 7 | let msg_ctx = use_context::().unwrap(); 8 | 9 | let message = msg_ctx.inner.to_owned(); 10 | 11 | html! { 12 |

{ message }

13 | } 14 | } 15 | -------------------------------------------------------------------------------- /examples/counter/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "counter" 3 | version = "0.1.1" 4 | authors = ["Denis Kolodin "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | gloo = "0.11" 10 | js-sys = "0.3" 11 | yew = { path = "../../packages/yew", features = ["csr"] } 12 | wasm-bindgen = "0.2" 13 | -------------------------------------------------------------------------------- /examples/counter/README.md: -------------------------------------------------------------------------------- 1 | # Counter Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fcounter)](https://examples.yew.rs/counter) 4 | 5 | A simple example of a counter which can be increased or decreased with the press of a button. 6 | 7 | ## Concepts 8 | 9 | Demonstrates the use of messages to update state. 10 | 11 | ## Running 12 | 13 | Run this application with the trunk development server: 14 | 15 | ```bash 16 | trunk serve --open 17 | ``` -------------------------------------------------------------------------------- /examples/counter/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/counter/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Counter 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/counter/index.scss: -------------------------------------------------------------------------------- 1 | button { 2 | background-color: #008f53; /* Green */ 3 | border: 0; 4 | color: white; 5 | padding: 14px 14px; 6 | text-align: center; 7 | font-size: 16px; 8 | margin: 2px 2px; 9 | width: 100px; 10 | } 11 | 12 | .counter { 13 | color: #008f53; 14 | font-size: 48px; 15 | text-align: center; 16 | } 17 | 18 | .footer { 19 | text-align: center; 20 | font-size: 12px; 21 | } 22 | 23 | .panel { 24 | display: flex; 25 | justify-content: center; 26 | } 27 | -------------------------------------------------------------------------------- /examples/counter_functional/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "counter_functional" 3 | version = "0.1.0" 4 | authors = ["Zahash "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | -------------------------------------------------------------------------------- /examples/counter_functional/README.md: -------------------------------------------------------------------------------- 1 | # Counter Example 2 | 3 | A simple example of a counter which can be increased or decreased with the press of a button implemented using function components 4 | 5 | ## Concepts 6 | 7 | Demonstrates the use of function components. 8 | 9 | ## Running 10 | 11 | Run this application with the trunk development server: 12 | 13 | ```bash 14 | trunk serve --open 15 | ``` -------------------------------------------------------------------------------- /examples/counter_functional/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/counter_functional/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Counter Function Yew 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /examples/dyn_create_destroy_apps/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "dyn_create_destroy_apps" 3 | version = "0.1.0" 4 | authors = ["Nicklas Warming Jacobsen "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | js-sys = "0.3" 10 | yew = { path = "../../packages/yew", features = ["csr"] } 11 | slab = "0.4.9" 12 | gloo = "0.11" 13 | wasm-bindgen = "0.2" 14 | 15 | [dependencies.web-sys] 16 | version = "0.3.70" 17 | features = [ 18 | "Document", 19 | "Element", 20 | "Node", 21 | "DomTokenList" 22 | ] 23 | -------------------------------------------------------------------------------- /examples/dyn_create_destroy_apps/README.md: -------------------------------------------------------------------------------- 1 | # Dynamic app creation and destruction example 2 | 3 | An example of how to create and destroy Yew apps on demand. 4 | 5 | ## Concepts 6 | 7 | Demonstrates the use of the Yew app handle by dynamically creating and destroying apps. 8 | 9 | ## Running 10 | 11 | Run this application with the trunk development server: 12 | 13 | ```bash 14 | trunk serve --open 15 | ``` -------------------------------------------------------------------------------- /examples/dyn_create_destroy_apps/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/dyn_create_destroy_apps/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Create and destroy apps 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/dyn_create_destroy_apps/index.scss: -------------------------------------------------------------------------------- 1 | button { 2 | border: 0; 3 | color: white; 4 | padding: 14px 14px; 5 | text-align: center; 6 | font-size: 16px; 7 | } 8 | 9 | button.create { 10 | background-color: #008f53; /* Green */ 11 | width: 200px; 12 | } 13 | 14 | button.destroy { 15 | background-color: #ff1f1f; /* Red */ 16 | } 17 | 18 | .counter { 19 | color: #008f53; 20 | font-size: 48px; 21 | text-align: center; 22 | } 23 | 24 | .panel { 25 | display: flex; 26 | justify-content: center; 27 | } 28 | -------------------------------------------------------------------------------- /examples/file_upload/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "file_upload" 3 | version = "0.1.0" 4 | authors = ["Denis Kolodin "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | js-sys = "0.3" 10 | yew = { path = "../../packages/yew", features = ["csr"] } 11 | base64 = "0.22.1" 12 | gloo = "0.11" 13 | 14 | [dependencies.web-sys] 15 | version = "0.3" 16 | features = ["DataTransfer"] 17 | -------------------------------------------------------------------------------- /examples/file_upload/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/file_upload/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • File Upload 6 | 7 | 8 | 9 | 13 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /examples/function_memory_game/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "function_memory_game" 3 | version = "0.1.0" 4 | authors = ["Howard.Zuo "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | serde = { version = "1.0", features = ["derive"] } 10 | strum = "0.27" 11 | strum_macros = "0.27" 12 | gloo = "0.11" 13 | nanoid = "0.4" 14 | rand = "0.9" 15 | getrandom = { version = "0.3", features = ["wasm_js"] } 16 | yew = { path = "../../packages/yew", features = ["csr"] } 17 | 18 | [dependencies.web-sys] 19 | version = "0.3" 20 | features = [ 21 | "HtmlInputElement", 22 | ] 23 | -------------------------------------------------------------------------------- /examples/function_memory_game/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/function_memory_game/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Yew • Function Memory Game 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /examples/function_memory_game/public/8-ball.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/8-ball.png -------------------------------------------------------------------------------- /examples/function_memory_game/public/back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/back.png -------------------------------------------------------------------------------- /examples/function_memory_game/public/baked-potato.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/baked-potato.png -------------------------------------------------------------------------------- /examples/function_memory_game/public/dinosaur.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/dinosaur.png -------------------------------------------------------------------------------- /examples/function_memory_game/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/favicon.ico -------------------------------------------------------------------------------- /examples/function_memory_game/public/kronos.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/kronos.png -------------------------------------------------------------------------------- /examples/function_memory_game/public/rocket.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/rocket.png -------------------------------------------------------------------------------- /examples/function_memory_game/public/skinny-unicorn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/skinny-unicorn.png -------------------------------------------------------------------------------- /examples/function_memory_game/public/that-guy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/that-guy.png -------------------------------------------------------------------------------- /examples/function_memory_game/public/zeppelin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/function_memory_game/public/zeppelin.png -------------------------------------------------------------------------------- /examples/function_memory_game/scss/chess_board.scss: -------------------------------------------------------------------------------- 1 | .chess-board { 2 | margin-top: 20px; 3 | width: 100%; 4 | background-color: #fff; 5 | height: 530px; 6 | border-radius: 4px; 7 | padding: 10px 5px; 8 | display: flex; 9 | flex-wrap: wrap; 10 | justify-content: center; 11 | align-items: center; 12 | align-content: space-around; 13 | .chess-board-card-container:nth-child(4n) { 14 | margin-right: 0px; 15 | } 16 | } 17 | 18 | @media screen and (max-width: 450px) { 19 | .chess-board { 20 | height: 480px; 21 | padding: 10px 0px; 22 | } 23 | } 24 | @media screen and (max-width: 370px) { 25 | .chess-board { 26 | height: 450px; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /examples/function_memory_game/scss/game_status_board.scss: -------------------------------------------------------------------------------- 1 | .game-status-container { 2 | position: relative; 3 | margin-top: 10px; 4 | width: 100%; 5 | height: 20px; 6 | line-height: 20px; 7 | text-align: center; 8 | font-size: 18px; 9 | font-weight: bold; 10 | button { 11 | border: none; 12 | cursor: pointer; 13 | background: transparent; 14 | color: #5979ac; 15 | font-size: 17px; 16 | font-weight: bold; 17 | } 18 | .sec-past { 19 | position: absolute; 20 | right: 10px; 21 | font-size: 15px; 22 | font-weight: normal; 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /examples/function_memory_game/src/components.rs: -------------------------------------------------------------------------------- 1 | pub mod app; 2 | pub mod chessboard; 3 | pub mod chessboard_card; 4 | pub mod game_status_board; 5 | pub mod score_board; 6 | pub mod score_board_best_score; 7 | pub mod score_board_logo; 8 | pub mod score_board_progress; 9 | -------------------------------------------------------------------------------- /examples/function_memory_game/src/components/chessboard.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | use yew::{function_component, html, Properties}; 3 | 4 | use crate::components::chessboard_card::ChessboardCard; 5 | use crate::state::{Card, RawCard}; 6 | 7 | #[derive(Properties, Clone, PartialEq)] 8 | pub struct Props { 9 | pub cards: Vec, 10 | pub on_flip: Callback, 11 | } 12 | #[function_component] 13 | pub fn Chessboard(props: &Props) -> Html { 14 | html! { 15 |
16 | { for props.cards.iter().map(|card| 17 | html! { 18 | 19 | } 20 | ) } 21 |
22 | } 23 | } 24 | -------------------------------------------------------------------------------- /examples/function_memory_game/src/components/score_board_best_score.rs: -------------------------------------------------------------------------------- 1 | use yew::{function_component, html, Html, Properties}; 2 | 3 | #[derive(PartialEq, Eq, Properties, Clone)] 4 | pub struct Props { 5 | pub best_score: u32, 6 | } 7 | 8 | #[function_component] 9 | pub fn BestScore(props: &Props) -> Html { 10 | html! { 11 |
12 | {"Highest Record"} 13 |

{ props.best_score }

14 |
15 | } 16 | } 17 | -------------------------------------------------------------------------------- /examples/function_memory_game/src/components/score_board_logo.rs: -------------------------------------------------------------------------------- 1 | use yew::{function_component, html, Html}; 2 | 3 | #[function_component] 4 | pub fn Logo() -> Html { 5 | html! { 6 |

7 | {"Memory"} 8 |

9 | } 10 | } 11 | -------------------------------------------------------------------------------- /examples/function_memory_game/src/components/score_board_progress.rs: -------------------------------------------------------------------------------- 1 | use yew::{function_component, html, Html, Properties}; 2 | 3 | #[derive(PartialEq, Eq, Properties, Clone)] 4 | pub struct Props { 5 | pub unresolved_card_pairs: u8, 6 | } 7 | 8 | #[function_component] 9 | pub fn GameProgress(props: &Props) -> Html { 10 | html! { 11 |
12 | {"Cards not Matched"} 13 |

{ props.unresolved_card_pairs }

14 |
15 | } 16 | } 17 | -------------------------------------------------------------------------------- /examples/function_memory_game/src/helper.rs: -------------------------------------------------------------------------------- 1 | use nanoid::nanoid; 2 | use rand::rng; 3 | use rand::seq::SliceRandom; 4 | 5 | use crate::constant::RAW_CARDS; 6 | use crate::state::Card; 7 | 8 | pub fn shuffle_cards() -> Vec { 9 | let mut raw_cards = RAW_CARDS; 10 | 11 | raw_cards.shuffle(&mut rng()); 12 | 13 | raw_cards 14 | .iter() 15 | .map(|&p| Card { 16 | id: nanoid!(), 17 | flipped: false, 18 | name: p, 19 | }) 20 | .collect() 21 | } 22 | -------------------------------------------------------------------------------- /examples/function_memory_game/src/main.rs: -------------------------------------------------------------------------------- 1 | mod components; 2 | mod constant; 3 | mod helper; 4 | mod state; 5 | 6 | use crate::components::app::App; 7 | 8 | fn main() { 9 | yew::Renderer::::new().render(); 10 | } 11 | -------------------------------------------------------------------------------- /examples/function_router/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "function_router" 3 | version = "0.1.0" 4 | edition = "2021" 5 | license = "MIT OR Apache-2.0" 6 | 7 | [dependencies] 8 | lipsum = "0.9.1" 9 | log = "0.4" 10 | rand = { version = "0.8", features = ["small_rng"] } 11 | yew = { path = "../../packages/yew" } 12 | yew-router = { path = "../../packages/yew-router" } 13 | serde = { version = "1.0", features = ["derive"] } 14 | gloo = "0.11" 15 | wasm-logger = "0.2" 16 | instant = { version = "0.1", features = ["wasm-bindgen"] } 17 | once_cell = "1" 18 | 19 | [target.'cfg(target_arch = "wasm32")'.dependencies] 20 | getrandom = { version = "0.3.1", features = ["wasm_js"] } 21 | 22 | [[bin]] 23 | name = "function_router" 24 | required-features = ["yew/csr"] 25 | -------------------------------------------------------------------------------- /examples/function_router/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/function_router/data/keywords.txt: -------------------------------------------------------------------------------- 1 | allergenics 2 | archaeology 3 | austria 4 | berries 5 | birds 6 | color 7 | conservation 8 | cosmology 9 | culture 10 | europe 11 | evergreens 12 | fleshy 13 | france 14 | guides 15 | horticulture 16 | ireland 17 | landscaping 18 | medicine 19 | music 20 | poison 21 | religion 22 | rome 23 | rust 24 | scotland 25 | seeds 26 | spain 27 | taxonomy 28 | toxics 29 | tradition 30 | trees 31 | wasm 32 | wood 33 | woodworking 34 | yew 35 | -------------------------------------------------------------------------------- /examples/function_router/data/syllables.txt: -------------------------------------------------------------------------------- 1 | ald 2 | ber 3 | fe 4 | ger 5 | jo 6 | jus 7 | kas 8 | lix 9 | lu 10 | mon 11 | mour 12 | nas 13 | ridge 14 | ry 15 | si 16 | star 17 | tey 18 | tim 19 | tin 20 | yew 21 | -------------------------------------------------------------------------------- /examples/function_router/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Yew • Function Router 8 | 9 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /examples/function_router/index.scss: -------------------------------------------------------------------------------- 1 | .hero { 2 | &.has-background { 3 | position: relative; 4 | overflow: hidden; 5 | } 6 | 7 | &-background { 8 | position: absolute; 9 | object-fit: cover; 10 | object-position: bottom; 11 | width: 100%; 12 | height: 100%; 13 | 14 | &.is-transparent { 15 | opacity: 0.3; 16 | } 17 | } 18 | } 19 | 20 | .burger { 21 | background-color: transparent; 22 | border: none; 23 | } 24 | 25 | .navbar-brand { 26 | align-items: center; 27 | } 28 | -------------------------------------------------------------------------------- /examples/function_router/src/bin/function_router.rs: -------------------------------------------------------------------------------- 1 | pub use function_router::*; 2 | 3 | fn main() { 4 | wasm_logger::init(wasm_logger::Config::new(log::Level::Trace)); 5 | yew::Renderer::::new().render(); 6 | } 7 | -------------------------------------------------------------------------------- /examples/function_router/src/components/mod.rs: -------------------------------------------------------------------------------- 1 | pub mod author_card; 2 | pub mod nav; 3 | pub mod pagination; 4 | pub mod post_card; 5 | pub mod progress_delay; 6 | -------------------------------------------------------------------------------- /examples/function_router/src/pages/mod.rs: -------------------------------------------------------------------------------- 1 | pub mod author; 2 | pub mod author_list; 3 | pub mod home; 4 | pub mod page_not_found; 5 | pub mod post; 6 | pub mod post_list; 7 | -------------------------------------------------------------------------------- /examples/function_router/src/pages/page_not_found.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[function_component] 4 | pub fn PageNotFound() -> Html { 5 | html! { 6 |
7 |
8 |
9 |

10 | { "Page not found" } 11 |

12 |

13 | { "Page page does not seem to exist" } 14 |

15 |
16 |
17 |
18 | } 19 | } 20 | -------------------------------------------------------------------------------- /examples/function_todomvc/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "function_todomvc" 3 | version = "0.1.0" 4 | authors = ["Drew Hutton "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | serde = { version = "1.0", features = ["derive"] } 10 | strum = "0.27" 11 | strum_macros = "0.27" 12 | gloo = "0.11" 13 | yew = { path = "../../packages/yew", features = ["csr"] } 14 | 15 | [dependencies.web-sys] 16 | version = "0.3" 17 | features = [ 18 | "HtmlInputElement", 19 | ] 20 | -------------------------------------------------------------------------------- /examples/function_todomvc/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/function_todomvc/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Yew • Function TodoMVC 7 | 11 | 15 | 16 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /examples/function_todomvc/src/components.rs: -------------------------------------------------------------------------------- 1 | pub mod entry; 2 | pub mod filter; 3 | pub mod header_input; 4 | pub mod info_footer; 5 | -------------------------------------------------------------------------------- /examples/function_todomvc/src/components/info_footer.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[function_component(InfoFooter)] 4 | pub fn info_footer() -> Html { 5 | html! { 6 | 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /examples/function_todomvc/src/hooks.rs: -------------------------------------------------------------------------------- 1 | pub mod use_bool_toggle; 2 | -------------------------------------------------------------------------------- /examples/futures/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "futures" 3 | version = "0.1.0" 4 | authors = ["Henry Zimmerman "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | pulldown-cmark = { version = "0.13", default-features = false } 10 | wasm-bindgen = "0.2" 11 | wasm-bindgen-futures = "0.4" 12 | yew = { path = "../../packages/yew", features = ["csr"] } 13 | gloo = "0.11" 14 | 15 | [dependencies.web-sys] 16 | version = "0.3" 17 | features = [ 18 | "Headers", 19 | "Request", 20 | "RequestInit", 21 | "RequestMode", 22 | "Response", 23 | "Window", 24 | ] 25 | -------------------------------------------------------------------------------- /examples/futures/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/futures/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Futures 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/game_of_life/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "game_of_life" 3 | version = "0.1.4" 4 | authors = [ 5 | "Diego Cardoso ", 6 | "Ilya Bogdanov " 8 | ] 9 | edition = "2021" 10 | license = "MIT OR Apache-2.0" 11 | 12 | [dependencies] 13 | getrandom = { version = "0.3", features = ["wasm_js"] } 14 | log = "0.4" 15 | rand = "0.9" 16 | wasm-logger = "0.2" 17 | yew = { path = "../../packages/yew", features = ["csr"] } 18 | gloo = "0.11" 19 | -------------------------------------------------------------------------------- /examples/game_of_life/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/game_of_life/assets/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yewstack/yew/122684babe9995a2be5991c28c17f4fd475bd9c8/examples/game_of_life/assets/favicon.ico -------------------------------------------------------------------------------- /examples/game_of_life/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Game of Life 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /examples/immutable/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "immutable" 3 | version = "0.1.0" 4 | edition = "2021" 5 | 6 | # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html 7 | 8 | [dependencies] 9 | implicit-clone = { version = "0.5", features = ["map"] } 10 | wasm-bindgen = "0.2" 11 | web-sys = "0.3" 12 | yew = { path = "../../packages/yew", features = ["csr"] } 13 | -------------------------------------------------------------------------------- /examples/immutable/README.md: -------------------------------------------------------------------------------- 1 | # Immutable Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fimmutable)](https://examples.yew.rs/immutable) 4 | 5 | This is a technical demonstration for how to use immutables types in Yew. 6 | 7 | ## Running 8 | 9 | Run this application with the trunk development server: 10 | 11 | ```bash 12 | trunk serve --open 13 | ``` -------------------------------------------------------------------------------- /examples/immutable/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/immutable/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Yew • Immutable 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /examples/immutable/index.scss: -------------------------------------------------------------------------------- 1 | $font-stack: Roboto, sans-serif; 2 | $primary-color: #f5f5f5; 3 | 4 | body { 5 | font: 100% $font-stack; 6 | color: black; 7 | background-color: $primary-color; 8 | margin: 0 auto; 9 | min-width: 230px; 10 | max-width: 550px; 11 | } 12 | -------------------------------------------------------------------------------- /examples/immutable/src/main.rs: -------------------------------------------------------------------------------- 1 | mod array; 2 | mod map; 3 | mod string; 4 | 5 | use yew::prelude::*; 6 | 7 | use self::array::*; 8 | use self::map::*; 9 | use self::string::*; 10 | 11 | #[function_component] 12 | fn App() -> Html { 13 | html! { 14 | <> 15 |

{ "IString Example" }

16 | 17 |
18 |

{ "IArray Example" }

19 | 20 |
21 |

{ "IMap Example" }

22 | 23 | 24 | } 25 | } 26 | 27 | fn main() { 28 | yew::Renderer::::new().render(); 29 | } 30 | -------------------------------------------------------------------------------- /examples/inner_html/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "inner_html" 3 | version = "0.1.0" 4 | authors = ["Garrett Berg "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | gloo = "0.11" 11 | 12 | [dependencies.web-sys] 13 | version = "0.3" 14 | features = ["console", "Document", "Element", "Node", "Window"] 15 | -------------------------------------------------------------------------------- /examples/inner_html/README.md: -------------------------------------------------------------------------------- 1 | # Inner HTML Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Finner_html)](https://examples.yew.rs/inner_html) 4 | 5 | This example renders unescaped HTML by manually handling the DOM element. 6 | 7 | ## Concepts 8 | 9 | - Manually creating `Html` without the `html!` macro. 10 | - Using `web-sys` to manipulate the DOM. 11 | 12 | ## Running 13 | 14 | Run this application with the trunk development server: 15 | 16 | ```bash 17 | trunk serve --open 18 | ``` -------------------------------------------------------------------------------- /examples/inner_html/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/inner_html/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Inner HTML 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/inner_html/src/document.html: -------------------------------------------------------------------------------- 1 |

Inline HTML with SVG

2 |

3 | The whole contents of this page is stored as a constant HTML string in the 4 | Rust source code. The code queries the DOM, creates a new element, and applies 5 | this snippet of HTML to the element's innerHTML. 6 |

7 | 8 | 12 | Sorry, your browser does not support inline SVG. 13 | 14 | -------------------------------------------------------------------------------- /examples/inner_html/src/main.rs: -------------------------------------------------------------------------------- 1 | use yew::{Component, Context, Html}; 2 | 3 | const HTML: &str = include_str!("document.html"); 4 | 5 | pub struct App; 6 | 7 | impl Component for App { 8 | type Message = (); 9 | type Properties = (); 10 | 11 | fn create(_ctx: &Context) -> Self { 12 | Self 13 | } 14 | 15 | fn view(&self, _ctx: &Context) -> Html { 16 | Html::from_html_unchecked(HTML.into()) 17 | } 18 | } 19 | 20 | fn main() { 21 | yew::Renderer::::new().render(); 22 | } 23 | -------------------------------------------------------------------------------- /examples/js_callback/.gitignore: -------------------------------------------------------------------------------- 1 | # this dir needs its own .gitignore because it has more build artificats 2 | trunk_post_build 3 | -------------------------------------------------------------------------------- /examples/js_callback/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "js_callback" 3 | version = "0.1.0" 4 | authors = ["Scott Steele "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | wasm-bindgen = "0.2" 10 | yew = { path = "../../packages/yew", features = ["csr"] } 11 | wasm-bindgen-futures = "0.4" 12 | js-sys = "0.3" 13 | once_cell = "1" 14 | -------------------------------------------------------------------------------- /examples/js_callback/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | 4 | [[hooks]] 5 | stage = "pre_build" 6 | command = "rustc" 7 | command_arguments = ["trunk_post_build.rs"] 8 | 9 | [[hooks]] 10 | stage = "post_build" 11 | command = "./trunk_post_build" 12 | 13 | -------------------------------------------------------------------------------- /examples/js_callback/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Js Callback 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/js_callback/js/imp.js: -------------------------------------------------------------------------------- 1 | export function hello() { 2 | return "very important message" 3 | } 4 | -------------------------------------------------------------------------------- /examples/js_callback/js/unimp.js: -------------------------------------------------------------------------------- 1 | export function bye() { 2 | return "unimportant message" 3 | } 4 | -------------------------------------------------------------------------------- /examples/keyed_list/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "keyed_list" 3 | version = "0.1.0" 4 | authors = ["Thomas Lacroix "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | fake = "4.0.0" 10 | getrandom = { version = "0.3", features = ["wasm_js"] } 11 | instant = { version = "0.1", features = ["wasm-bindgen"] } 12 | log = "0.4" 13 | rand = "0.9" 14 | wasm-logger = "0.2" 15 | yew = { path = "../../packages/yew", features = ["csr"] } 16 | 17 | [dependencies.web-sys] 18 | version = "0.3" 19 | features = [ 20 | "HtmlElement", 21 | "HtmlInputElement", 22 | ] 23 | -------------------------------------------------------------------------------- /examples/keyed_list/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/keyed_list/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Keyed list 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /examples/keyed_list/styles.css: -------------------------------------------------------------------------------- 1 | .component-person { 2 | color: blue; 3 | } 4 | 5 | .basic-person { 6 | color: red; 7 | } 8 | 9 | .btn_size { 10 | width: 100%; 11 | height: 75px; 12 | } 13 | 14 | .card_style { 15 | margin:5px; 16 | } 17 | -------------------------------------------------------------------------------- /examples/mount_point/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "mount_point" 3 | version = "0.1.0" 4 | authors = ["Ben Berman "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | wasm-bindgen = "0.2" 10 | yew = { path = "../../packages/yew", features = ["csr"] } 11 | gloo = "0.11" 12 | 13 | [dependencies.web-sys] 14 | version = "0.3" 15 | features = [ 16 | "CanvasRenderingContext2d", 17 | "Document", 18 | "DomTokenList", 19 | "Element", 20 | "HtmlCanvasElement", 21 | "Node", 22 | "Window" 23 | ] 24 | -------------------------------------------------------------------------------- /examples/mount_point/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/mount_point/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Mount Point 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/nested_list/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "nested_list" 3 | version = "0.1.0" 4 | authors = ["Justin Starry "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | log = "0.4" 10 | wasm-logger = "0.2" 11 | yew = { path = "../../packages/yew", features = ["csr"] } 12 | -------------------------------------------------------------------------------- /examples/nested_list/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/nested_list/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Nested List 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/node_refs/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "node_refs" 3 | version = "0.1.0" 4 | authors = ["Justin Starry "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | web-sys = { version = "0.3", features = ["HtmlElement", "HtmlInputElement", "Node"] } 11 | -------------------------------------------------------------------------------- /examples/node_refs/README.md: -------------------------------------------------------------------------------- 1 | # Node Refs Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fnode_refs)](https://examples.yew.rs/node_refs) 4 | 5 | This example shows two input fields which are automatically focused when hovered over. 6 | 7 | ## Concepts 8 | 9 | The example uses [Refs](https://yew.rs/docs/concepts/function-components/node-refs) to 10 | manipulate the underlying DOM element directly. 11 | 12 | ## Running 13 | 14 | Run this application with the trunk development server: 15 | 16 | ```bash 17 | trunk serve --open 18 | ``` -------------------------------------------------------------------------------- /examples/node_refs/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/node_refs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Node Refs 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/password_strength/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "password_strength" 3 | version = "0.1.0" 4 | authors = ["Philip Peterson "] 5 | edition = "2021" 6 | 7 | # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | zxcvbn = "3.1.0" 11 | time = "0.3.36" 12 | js-sys = "0.3.70" 13 | web-sys = { version = "0.3", features = ["Event","EventTarget","InputEvent"] } 14 | wasm-bindgen = "0.2" 15 | chrono = { version = "0.4", features = ["wasmbind"] } 16 | -------------------------------------------------------------------------------- /examples/password_strength/README.md: -------------------------------------------------------------------------------- 1 | # Password Strength Estimator Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fpassword_strength)](https://examples.yew.rs/password_strength) 4 | 5 | A password strength estimator implemented in Yew. 6 | 7 | ### Notes 8 | 9 | If this example is a bit slow, you should try running it with the `release` profile. 10 | 11 | ## Concepts 12 | 13 | This example 14 | 15 | - makes use of controlled components. 16 | - extracts new value from `InputEvent` 17 | - calls out to `js_sys` to invoke a foreign function, `Math.random()` 18 | 19 | ## Running 20 | 21 | Run this application with the trunk development server: 22 | 23 | ```bash 24 | trunk serve --open 25 | ``` -------------------------------------------------------------------------------- /examples/password_strength/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/password_strength/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Password Strength Estimator 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/password_strength/src/main.rs: -------------------------------------------------------------------------------- 1 | #![recursion_limit = "256"] 2 | 3 | mod text_input; 4 | 5 | mod app; 6 | mod password; 7 | 8 | use app::App; 9 | 10 | fn main() { 11 | yew::Renderer::::new().render(); 12 | } 13 | -------------------------------------------------------------------------------- /examples/portals/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "portals" 3 | version = "0.1.0" 4 | authors = ["Martin Molzer "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | gloo = "0.11" 11 | wasm-bindgen = "0.2" 12 | 13 | [dependencies.web-sys] 14 | version = "0.3" 15 | features = [ 16 | "Document", 17 | "Element", 18 | "Node", 19 | "HtmlHeadElement", 20 | "ShadowRoot", 21 | "ShadowRootInit", 22 | "ShadowRootMode", 23 | ] 24 | -------------------------------------------------------------------------------- /examples/portals/README.md: -------------------------------------------------------------------------------- 1 | # Portals Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fportals)](https://examples.yew.rs/portals) 4 | 5 | This example renders elements into out-of-tree nodes with the help of portals. 6 | 7 | ## Concepts 8 | 9 | - Manually creating `Html` without the `html!` macro. 10 | - Using `web-sys` to manipulate the DOM. 11 | 12 | ## Running 13 | 14 | Run this application with the trunk development server: 15 | 16 | ```bash 17 | trunk serve --open 18 | ``` -------------------------------------------------------------------------------- /examples/portals/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/portals/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Portals 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/router/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "router" 3 | version = "0.1.0" 4 | edition = "2021" 5 | license = "MIT OR Apache-2.0" 6 | 7 | [dependencies] 8 | instant = { version = "0.1", features = ["wasm-bindgen"] } 9 | lipsum = "0.9.1" 10 | log = "0.4" 11 | getrandom = { version = "0.2", features = ["js"] } 12 | rand = { version = "0.8", features = ["small_rng"] } 13 | wasm-logger = "0.2" 14 | yew = { path = "../../packages/yew", features = ["csr"] } 15 | yew-router = { path = "../../packages/yew-router" } 16 | serde = { version = "1.0", features = ["derive"] } 17 | once_cell = "1" 18 | gloo = "0.11" 19 | -------------------------------------------------------------------------------- /examples/router/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/router/data/keywords.txt: -------------------------------------------------------------------------------- 1 | allergenics 2 | archaeology 3 | austria 4 | berries 5 | birds 6 | color 7 | conservation 8 | cosmology 9 | culture 10 | europe 11 | evergreens 12 | fleshy 13 | france 14 | guides 15 | horticulture 16 | ireland 17 | landscaping 18 | medicine 19 | music 20 | poison 21 | religion 22 | rome 23 | rust 24 | scotland 25 | seeds 26 | spain 27 | taxonomy 28 | toxics 29 | tradition 30 | trees 31 | wasm 32 | wood 33 | woodworking 34 | yew 35 | -------------------------------------------------------------------------------- /examples/router/data/syllables.txt: -------------------------------------------------------------------------------- 1 | ald 2 | ber 3 | fe 4 | ger 5 | jo 6 | jus 7 | kas 8 | lix 9 | lu 10 | mon 11 | mour 12 | nas 13 | ridge 14 | ry 15 | si 16 | star 17 | tey 18 | tim 19 | tin 20 | yew 21 | -------------------------------------------------------------------------------- /examples/router/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Yew • Router 8 | 9 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /examples/router/index.scss: -------------------------------------------------------------------------------- 1 | .hero { 2 | &.has-background { 3 | position: relative; 4 | overflow: hidden; 5 | } 6 | 7 | &-background { 8 | position: absolute; 9 | object-fit: cover; 10 | object-position: bottom; 11 | width: 100%; 12 | height: 100%; 13 | 14 | &.is-transparent { 15 | opacity: 0.3; 16 | } 17 | } 18 | } 19 | 20 | .burger { 21 | background-color: transparent; 22 | border: none; 23 | } 24 | 25 | .navbar-brand { 26 | align-items: center; 27 | } 28 | -------------------------------------------------------------------------------- /examples/router/src/components/mod.rs: -------------------------------------------------------------------------------- 1 | pub mod author_card; 2 | pub mod pagination; 3 | pub mod post_card; 4 | pub mod progress_delay; 5 | -------------------------------------------------------------------------------- /examples/router/src/pages/mod.rs: -------------------------------------------------------------------------------- 1 | pub mod author; 2 | pub mod author_list; 3 | pub mod home; 4 | pub mod page_not_found; 5 | pub mod post; 6 | pub mod post_list; 7 | -------------------------------------------------------------------------------- /examples/simple_ssr/README.md: -------------------------------------------------------------------------------- 1 | # Server-side Rendering Example 2 | 3 | This example demonstrates server-side rendering. 4 | 5 | # Running 6 | 7 | 1. Build hydration bundle 8 | 9 | `trunk build index.html` 10 | 11 | 2. Run the server 12 | 13 | `cargo run --features=ssr --bin simple_ssr_server -- --dir dist` -------------------------------------------------------------------------------- /examples/simple_ssr/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Yew SSR Example 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/simple_ssr/src/bin/simple_ssr_hydrate.rs: -------------------------------------------------------------------------------- 1 | use simple_ssr::App; 2 | 3 | fn main() { 4 | #[cfg(target_arch = "wasm32")] 5 | wasm_logger::init(wasm_logger::Config::new(log::Level::Trace)); 6 | yew::Renderer::::new().hydrate(); 7 | } 8 | -------------------------------------------------------------------------------- /examples/ssr_router/README.md: -------------------------------------------------------------------------------- 1 | # SSR Router Example 2 | 3 | This example is the same as the function router example, but with 4 | server-side rendering and hydration support. It reuses the same codebase 5 | of the function router example. 6 | 7 | # How to run this example 8 | 9 | 1. Build Hydration Bundle 10 | 11 | `trunk build index.html` 12 | 13 | 2. Run the server 14 | 15 | `cargo run --features=ssr --bin ssr_router_server -- --dir dist` 16 | -------------------------------------------------------------------------------- /examples/ssr_router/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Yew • SSR Router 9 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/ssr_router/src/bin/ssr_router_hydrate.rs: -------------------------------------------------------------------------------- 1 | use function_router::App; 2 | 3 | fn main() { 4 | #[cfg(target_arch = "wasm32")] 5 | wasm_logger::init(wasm_logger::Config::new(log::Level::Trace)); 6 | yew::Renderer::::new().hydrate(); 7 | } 8 | -------------------------------------------------------------------------------- /examples/ssr_router/src/lib.rs: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /examples/suspense/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "suspense" 3 | version = "0.1.0" 4 | edition = "2021" 5 | license = "MIT OR Apache-2.0" 6 | 7 | # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html 8 | 9 | [dependencies] 10 | yew = { path = "../../packages/yew", features = ["csr"] } 11 | gloo = { version = "0.11", features = ["futures"] } 12 | wasm-bindgen-futures = "0.4" 13 | wasm-bindgen = "0.2" 14 | 15 | [dependencies.web-sys] 16 | version = "0.3" 17 | features = [ 18 | "HtmlTextAreaElement", 19 | ] 20 | -------------------------------------------------------------------------------- /examples/suspense/README.md: -------------------------------------------------------------------------------- 1 | # Suspense Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fsuspense)](https://examples.yew.rs/suspense) 4 | 5 | This is an example that demonstrates `` support. 6 | 7 | ## Concepts 8 | 9 | This example shows how `` works in Yew and how you can 10 | create hooks that utilises suspense. 11 | 12 | ## Running 13 | 14 | Run this application with the trunk development server: 15 | 16 | ```bash 17 | trunk serve --open 18 | ``` -------------------------------------------------------------------------------- /examples/suspense/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/suspense/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew Suspense Demo 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /examples/timer/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "timer" 3 | version = "0.1.0" 4 | authors = ["Denis Kolodin "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | js-sys = "0.3" 11 | gloo = "0.11" 12 | wasm-bindgen = "0.2" 13 | -------------------------------------------------------------------------------- /examples/timer/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/timer/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Yew • Timer 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /examples/timer/index.scss: -------------------------------------------------------------------------------- 1 | $font-stack: Roboto, sans-serif; 2 | $primary-color: #008f53; 3 | 4 | body { 5 | font: 100% $font-stack; 6 | color: white; 7 | background-color: $primary-color; 8 | } 9 | 10 | #buttons { 11 | text-align: right; 12 | } 13 | 14 | #wrapper { 15 | overflow: hidden; 16 | width: 100%; 17 | } 18 | 19 | #time { 20 | text-align: center; 21 | font-size: 17vh; 22 | padding: 15% 0; 23 | float: left; 24 | } 25 | 26 | #messages { 27 | float: right; 28 | } 29 | 30 | -------------------------------------------------------------------------------- /examples/timer_functional/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "timer_functional" 3 | version = "0.1.0" 4 | authors = ["Zahash "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | gloo = "0.11.0" 10 | js-sys = "0.3.70" 11 | yew = { path = "../../packages/yew", features = ["csr"] } 12 | -------------------------------------------------------------------------------- /examples/timer_functional/README.md: -------------------------------------------------------------------------------- 1 | # Timer Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Ftimer_functional)](https://examples.yew.rs/timer_functional) 4 | 5 | This is a technical demonstration for how to use timeouts and intervals. 6 | 7 | ## Concepts 8 | 9 | The example mainly demonstrates the use of [`gloo_timer`](https://docs.rs/gloo-timers/ ) but does so using only [`function components`](https://yew.rs/docs/concepts/function-components). 10 | 11 | ## Running 12 | 13 | Run a debug version of this application: 14 | 15 | ```bash 16 | trunk serve --open 17 | ``` -------------------------------------------------------------------------------- /examples/timer_functional/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/timer_functional/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Yew • Timer 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /examples/timer_functional/index.scss: -------------------------------------------------------------------------------- 1 | $font-stack: Roboto, sans-serif; 2 | $primary-color: #008f53; 3 | 4 | body { 5 | font: 100% $font-stack; 6 | color: white; 7 | background-color: $primary-color; 8 | } 9 | 10 | #buttons { 11 | text-align: right; 12 | } 13 | 14 | #wrapper { 15 | overflow: hidden; 16 | width: 100%; 17 | } 18 | 19 | #time { 20 | text-align: center; 21 | font-size: 17vh; 22 | padding: 15% 0; 23 | float: left; 24 | } 25 | 26 | #messages { 27 | float: right; 28 | } 29 | 30 | -------------------------------------------------------------------------------- /examples/todomvc/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "todomvc" 3 | version = "0.1.0" 4 | authors = ["Denis Kolodin "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | strum = "0.27" 10 | strum_macros = "0.27" 11 | serde = "1" 12 | serde_derive = "1" 13 | yew = { path = "../../packages/yew", features = ["csr"] } 14 | gloo = "0.11" 15 | 16 | [dependencies.web-sys] 17 | version = "0.3" 18 | features = [ 19 | "HtmlInputElement", 20 | ] 21 | -------------------------------------------------------------------------------- /examples/todomvc/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/todomvc/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Yew • TodoMVC 7 | 11 | 15 | 16 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /examples/two_apps/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "two_apps" 3 | version = "0.1.0" 4 | authors = ["Denis Kolodin "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | yew = { path = "../../packages/yew", features = ["csr"] } 10 | gloo = "0.11" 11 | -------------------------------------------------------------------------------- /examples/two_apps/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/two_apps/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • Two Apps 6 | 7 | 8 | 9 | 10 |
11 |
12 | 13 | 14 | -------------------------------------------------------------------------------- /examples/wasi_ssr_module/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "wasi_ssr_module" 3 | version = "0.1.0" 4 | edition = "2021" 5 | authors = ["langyo "] 6 | 7 | [dependencies] 8 | yew = { path = "../../packages/yew", features = ["ssr"] } 9 | yew-router = { path = "../../packages/yew-router" } 10 | 11 | anyhow = "^1" 12 | bytes = "^1" 13 | serde = { version = "^1", features = ["derive"] } 14 | serde_json = "^1" 15 | lazy_static = "^1" 16 | 17 | tokio = { version = "^1", features = ["macros", "rt", "time"] } 18 | -------------------------------------------------------------------------------- /examples/wasi_ssr_module/src/router.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | use yew_router::prelude::*; 3 | 4 | #[derive(Routable, PartialEq, Eq, Clone, Debug)] 5 | pub enum Route { 6 | #[at("/")] 7 | Portal, 8 | 9 | #[at("/t/:id")] 10 | Thread { id: String }, 11 | 12 | #[not_found] 13 | #[at("/404")] 14 | NotFound, 15 | } 16 | 17 | pub fn switch(routes: Route) -> Html { 18 | match routes { 19 | Route::Portal => { 20 | html! {

{"Hello"}

} 21 | } 22 | Route::Thread { id } => { 23 | html! {

{format!("Thread id {}", id)}

} 24 | } 25 | Route::NotFound => { 26 | html! {

{"Not found"}

} 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /examples/web_worker_fib/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "yew-worker-fib" 3 | version = "0.1.0" 4 | edition = "2021" 5 | authors = ["Shrey Somaiya", "Zac Kologlu"] 6 | 7 | [dependencies] 8 | yew = { path = "../../packages/yew", features = ["csr"] } 9 | yew-agent = { path = "../../packages/yew-agent" } 10 | wasm-bindgen = "0.2" 11 | js-sys = "0.3" 12 | web-sys = { version = "0.3", features = [ "HtmlInputElement" ] } 13 | serde = { version = "1", features = ["derive"] } 14 | postcard = "1.0.10" 15 | -------------------------------------------------------------------------------- /examples/web_worker_fib/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/web_worker_fib/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Yew • Web Worker Fibonacci 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/web_worker_fib/src/bin/app.rs: -------------------------------------------------------------------------------- 1 | fn main() { 2 | yew::Renderer::::new().render(); 3 | } 4 | -------------------------------------------------------------------------------- /examples/web_worker_fib/src/bin/worker.rs: -------------------------------------------------------------------------------- 1 | use yew_agent::Registrable; 2 | use yew_worker_fib::agent::{FibonacciTask, Postcard}; 3 | 4 | fn main() { 5 | FibonacciTask::registrar().encoding::().register(); 6 | } 7 | -------------------------------------------------------------------------------- /examples/web_worker_prime/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "yew-worker-prime" 3 | version = "0.1.0" 4 | edition = "2021" 5 | 6 | [dependencies] 7 | yew-agent = { path = "../../packages/yew-agent" } 8 | yew = { path = "../../packages/yew", features = ["csr"] } 9 | futures = "0.3.30" 10 | primes = "0.4.0" 11 | serde = { version = "1.0.218", features = ["derive"] } 12 | -------------------------------------------------------------------------------- /examples/web_worker_prime/README.md: -------------------------------------------------------------------------------- 1 | # Web Worker Prime 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fweb_worker_prime)](https://examples.yew.rs/web_worker_prime) 4 | 5 | Calculate primes until stop button is pressed, without blocking the main thread. 6 | 7 | ## Concepts 8 | 9 | The example illustrates how to use reactor agents to offload CPU bound tasks to a worker thread in a Yew application. 10 | 11 | ## Running 12 | 13 | Run this application with the trunk development server: 14 | 15 | ```bash 16 | trunk serve --open 17 | ``` 18 | -------------------------------------------------------------------------------- /examples/web_worker_prime/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/web_worker_prime/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Yew • Web Worker Prime 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/web_worker_prime/src/bin/app.rs: -------------------------------------------------------------------------------- 1 | fn main() { 2 | yew::Renderer::::new().render(); 3 | } 4 | -------------------------------------------------------------------------------- /examples/web_worker_prime/src/bin/worker.rs: -------------------------------------------------------------------------------- 1 | use yew_agent::Registrable; 2 | use yew_worker_prime::agent::PrimeReactor; 3 | 4 | fn main() { 5 | PrimeReactor::registrar().register(); 6 | } 7 | -------------------------------------------------------------------------------- /examples/webgl/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "webgl" 3 | version = "0.1.0" 4 | authors = ["Miklós Tusz "] 5 | edition = "2021" 6 | license = "MIT OR Apache-2.0" 7 | 8 | [dependencies] 9 | js-sys = "0.3" 10 | wasm-bindgen = "0.2" 11 | yew = { path = "../../packages/yew", features = ["csr"] } 12 | 13 | [dependencies.web-sys] 14 | version = "0.3" 15 | features = [ 16 | 'HtmlCanvasElement', 17 | 'WebGlBuffer', 18 | 'WebGlProgram', 19 | 'WebGlRenderingContext', 20 | 'WebGlShader', 21 | 'WebGlUniformLocation', 22 | ] 23 | -------------------------------------------------------------------------------- /examples/webgl/README.md: -------------------------------------------------------------------------------- 1 | # WebGL Example 2 | 3 | [![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fexamples.yew.rs%2Fwebgl)](https://examples.yew.rs/webgl) 4 | 5 | This is a simple demo using WebGL with Yew to initialize the GL context, create 6 | a render loop, and draw to the canvas with basic shaders using `web-sys`. 7 | 8 | ## Concepts 9 | 10 | - Accessing a DOM element using [`NodeRef`](https://yew.rs/docs/concepts/components/refs/). 11 | - Using Javascript APIs with `web-sys`. 12 | 13 | ## Improvements 14 | 15 | - Use a much more flashy shader 16 | 17 | ## Running 18 | 19 | Run this application with the trunk development server: 20 | 21 | ```bash 22 | trunk serve --open 23 | ``` -------------------------------------------------------------------------------- /examples/webgl/Trunk.toml: -------------------------------------------------------------------------------- 1 | [tools] 2 | wasm_opt = "version_122" 3 | -------------------------------------------------------------------------------- /examples/webgl/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Yew • WebGL 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /examples/webgl/src/basic.frag: -------------------------------------------------------------------------------- 1 | precision mediump float; 2 | 3 | uniform float u_time; 4 | 5 | void main() { 6 | float r = sin(u_time * 0.0003); 7 | float g = sin(u_time * 0.0005); 8 | float b = sin(u_time * 0.0007); 9 | 10 | gl_FragColor = vec4(r, g, b, 1.0); 11 | } 12 | -------------------------------------------------------------------------------- /examples/webgl/src/basic.vert: -------------------------------------------------------------------------------- 1 | precision mediump float; 2 | 3 | attribute vec2 a_position; 4 | 5 | void main() { 6 | gl_Position = vec4(a_position, 0.0, 1.0); 7 | } 8 | -------------------------------------------------------------------------------- /packages/yew-agent-macro/Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "yew-agent-macro" 3 | version = "0.2.0" 4 | edition = "2021" 5 | rust-version = "1.76.0" 6 | authors = ["Kaede Hoshikawa "] 7 | repository = "https://github.com/yewstack/yew" 8 | homepage = "https://yew.rs" 9 | documentation = "https://docs.rs/yew/" 10 | readme = "../../README.md" 11 | description = "Macro Support for Yew Agents" 12 | license = "MIT OR Apache-2.0" 13 | 14 | [lib] 15 | proc-macro = true 16 | 17 | [dependencies] 18 | proc-macro2 = "1" 19 | quote = "1" 20 | syn = { version = "2", features = ["full", "extra-traits"] } 21 | 22 | [dev-dependencies] 23 | rustversion = "1" 24 | trybuild = "1" 25 | yew-agent = { path = "../yew-agent" } 26 | -------------------------------------------------------------------------------- /packages/yew-agent/src/oneshot/mod.rs: -------------------------------------------------------------------------------- 1 | //! This module provides task agent implementation. 2 | 3 | mod bridge; 4 | mod hooks; 5 | mod provider; 6 | mod registrar; 7 | mod spawner; 8 | mod traits; 9 | mod worker; 10 | 11 | pub use bridge::OneshotBridge; 12 | pub use hooks::{use_oneshot_runner, UseOneshotRunnerHandle}; 13 | pub use provider::OneshotProvider; 14 | pub(crate) use provider::OneshotProviderState; 15 | pub use registrar::OneshotRegistrar; 16 | pub use spawner::OneshotSpawner; 17 | pub use traits::Oneshot; 18 | /// A procedural macro to create oneshot agents. 19 | pub use yew_agent_macro::oneshot; 20 | -------------------------------------------------------------------------------- /packages/yew-agent/src/oneshot/traits.rs: -------------------------------------------------------------------------------- 1 | use std::future::Future; 2 | 3 | /// A future-based worker that for each input, one output is produced. 4 | pub trait Oneshot: Future { 5 | /// Incoming message type. 6 | type Input; 7 | 8 | /// Creates an oneshot worker. 9 | fn create(input: Self::Input) -> Self; 10 | } 11 | -------------------------------------------------------------------------------- /packages/yew-agent/src/reach.rs: -------------------------------------------------------------------------------- 1 | /// The reachability of an agent. 2 | #[derive(Debug, Clone, PartialEq, Eq, Hash, Copy)] 3 | pub enum Reach { 4 | /// Public Reachability. 5 | Public, 6 | /// Private Reachability. 7 | Private, 8 | } 9 | -------------------------------------------------------------------------------- /packages/yew-agent/src/reactor/messages.rs: -------------------------------------------------------------------------------- 1 | use serde::{Deserialize, Serialize}; 2 | 3 | /// The Bridge Input. 4 | #[derive(Debug, Serialize, Deserialize)] 5 | pub(crate) enum ReactorInput { 6 | /// An input message. 7 | Input(I), 8 | } 9 | 10 | /// The Bridge Output. 11 | #[derive(Debug, Serialize, Deserialize)] 12 | pub enum ReactorOutput { 13 | /// An output message has been received. 14 | Output(O), 15 | /// Reactor for current bridge has exited. 16 | Finish, 17 | } 18 | -------------------------------------------------------------------------------- /packages/yew-agent/src/reactor/traits.rs: -------------------------------------------------------------------------------- 1 | use std::future::Future; 2 | 3 | use super::scope::ReactorScoped; 4 | 5 | /// A reactor worker. 6 | pub trait Reactor: Future { 7 | /// The Reactor Scope 8 | type Scope: ReactorScoped; 9 | 10 | /// Creates a reactor worker. 11 | fn create(scope: Self::Scope) -> Self; 12 | } 13 | -------------------------------------------------------------------------------- /packages/yew-agent/src/traits.rs: -------------------------------------------------------------------------------- 1 | //! Submodule providing the `Spawnable` and `Registrable` traits. 2 | 3 | /// A Worker that can be spawned by a spawner. 4 | pub trait Spawnable { 5 | /// Spawner Type. 6 | type Spawner; 7 | 8 | /// Creates a spawner. 9 | fn spawner() -> Self::Spawner; 10 | } 11 | 12 | /// A trait to enable public workers being registered in a web worker. 13 | pub trait Registrable { 14 | /// Registrar Type. 15 | type Registrar; 16 | 17 | /// Creates a registrar for the current worker. 18 | fn registrar() -> Self::Registrar; 19 | } 20 | -------------------------------------------------------------------------------- /packages/yew-agent/src/worker/handler_id.rs: -------------------------------------------------------------------------------- 1 | use std::sync::atomic::{AtomicUsize, Ordering}; 2 | 3 | use serde::{Deserialize, Serialize}; 4 | 5 | /// Identifier to send output to bridges. 6 | #[derive(Debug, Serialize, Deserialize, Eq, PartialEq, Hash, Clone, Copy)] 7 | pub struct HandlerId(usize); 8 | 9 | impl HandlerId { 10 | pub(crate) fn new() -> Self { 11 | static CTR: AtomicUsize = AtomicUsize::new(0); 12 | 13 | let id = CTR.fetch_add(1, Ordering::SeqCst); 14 | 15 | HandlerId(id) 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /packages/yew-macro/Makefile.toml: -------------------------------------------------------------------------------- 1 | [tasks.test] 2 | clear = true 3 | toolchain = "1.76.0" 4 | command = "cargo" 5 | # test target can be optionally specified like `cargo make test html_macro`, 6 | args = ["test", "${@}"] 7 | 8 | [tasks.test-lint] 9 | clear = true 10 | toolchain = "nightly" 11 | command = "cargo" 12 | args = ["test", "test_html_lints", "--features", "lints"] 13 | 14 | [tasks.test-overwrite] 15 | extend = "test" 16 | env = { TRYBUILD = "overwrite" } 17 | -------------------------------------------------------------------------------- /packages/yew-macro/release.toml: -------------------------------------------------------------------------------- 1 | tag = false 2 | -------------------------------------------------------------------------------- /packages/yew-macro/src/props/mod.rs: -------------------------------------------------------------------------------- 1 | mod component; 2 | mod element; 3 | mod prop; 4 | mod prop_macro; 5 | 6 | pub use component::*; 7 | pub use element::*; 8 | pub use prop::*; 9 | pub use prop_macro::PropsMacroInput; 10 | 11 | const CHILDREN_LABEL: &str = "children"; 12 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/classes_macro/classes-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | fn compile_pass() { 4 | classes!(42); 5 | classes!(42.0); 6 | 7 | classes!("one" "two"); 8 | 9 | classes!(vec![42]); 10 | 11 | let some = Some(42); 12 | let none: Option = None; 13 | classes!(some); 14 | classes!(none); 15 | 16 | classes!("one", 42); 17 | 18 | classes!("one", "two three", "four"); 19 | } 20 | 21 | fn main() {} 22 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/classes_macro_test.rs: -------------------------------------------------------------------------------- 1 | #[allow(dead_code)] 2 | #[rustversion::attr(stable(1.76), test)] 3 | fn classes_macro() { 4 | let t = trybuild::TestCases::new(); 5 | t.pass("tests/classes_macro/*-pass.rs"); 6 | t.compile_fail("tests/classes_macro/*-fail.rs"); 7 | } 8 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/derive_props_test.rs: -------------------------------------------------------------------------------- 1 | #[allow(dead_code)] 2 | #[rustversion::attr(stable(1.76), test)] 3 | fn derive_props() { 4 | let t = trybuild::TestCases::new(); 5 | t.pass("tests/derive_props/pass.rs"); 6 | t.compile_fail("tests/derive_props/fail.rs"); 7 | } 8 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_attr_test.rs: -------------------------------------------------------------------------------- 1 | #[allow(dead_code)] 2 | #[rustversion::attr(stable(1.76), test)] 3 | fn tests() { 4 | let t = trybuild::TestCases::new(); 5 | t.pass("tests/function_component_attr/*-pass.rs"); 6 | t.compile_fail("tests/function_component_attr/*-fail.rs"); 7 | } 8 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/applied-to-non-fn-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | struct Test; 10 | 11 | fn main() {} 12 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/applied-to-non-fn-fail.stderr: -------------------------------------------------------------------------------- 1 | error: `function_component` attribute can only be applied to functions 2 | --> $DIR/applied-to-non-fn-fail.rs:9:1 3 | | 4 | 9 | struct Test; 5 | | ^^^^^^^^^^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/async-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | async fn comp(props: &Props) -> Html { 10 | html! { 11 |

12 | { props.a } 13 |

14 | } 15 | } 16 | 17 | 18 | fn main() {} 19 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/async-fail.stderr: -------------------------------------------------------------------------------- 1 | error: function components can't be async 2 | --> $DIR/async-fail.rs:9:1 3 | | 4 | 9 | async fn comp(props: &Props) -> Html { 5 | | ^^^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/bad-props-param-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | fn comp(props: Props) -> Html { 10 | html! { 11 |

12 | { props.a } 13 |

14 | } 15 | } 16 | 17 | fn main() {} 18 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/bad-props-param-fail.stderr: -------------------------------------------------------------------------------- 1 | error: expected a reference to a `Properties` type (try: `&Props`) 2 | --> $DIR/bad-props-param-fail.rs:9:16 3 | | 4 | 9 | fn comp(props: Props) -> Html { 5 | | ^^^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/bad-return-type-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp1)] 9 | fn comp_1(_props: &Props) {} 10 | 11 | #[function_component(Comp)] 12 | fn comp(_props: &Props) -> u32 { 13 | 1 14 | } 15 | 16 | fn main() {} 17 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/const-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | const fn comp(props: &Props) -> Html { 10 | html! { 11 |

12 | { props.a } 13 |

14 | } 15 | } 16 | 17 | fn main() {} 18 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/const-fail.stderr: -------------------------------------------------------------------------------- 1 | error: const functions can't be function components 2 | --> $DIR/const-fail.rs:9:1 3 | | 4 | 9 | const fn comp(props: &Props) -> Html { 5 | | ^^^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/extern-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | extern "C" fn comp(props: &Props) -> Html { 10 | html! { 11 |

12 | { props.a } 13 |

14 | } 15 | } 16 | 17 | fn main() {} 18 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/extern-fail.stderr: -------------------------------------------------------------------------------- 1 | error: extern functions can't be function components 2 | --> $DIR/extern-fail.rs:9:1 3 | | 4 | 9 | extern "C" fn comp(props: &Props) -> Html { 5 | | ^^^^^^^^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/generic-lifetime-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | fn comp<'a>(props: &'a Props) -> Html { 10 | html! { 11 |

12 | { props.a } 13 |

14 | } 15 | } 16 | 17 | fn main() {} 18 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/generic-lifetime-fail.stderr: -------------------------------------------------------------------------------- 1 | error: function components can't have generic lifetime parameters 2 | --> $DIR/generic-lifetime-fail.rs:9:8 3 | | 4 | 9 | fn comp<'a>(props: &'a Props) -> Html { 5 | | ^^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/lifetime-props-param-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | fn comp(props: &'static Props) -> Html { 10 | html! { 11 |

12 | { props.a } 13 |

14 | } 15 | } 16 | 17 | fn main() {} 18 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/lifetime-props-param-fail.stderr: -------------------------------------------------------------------------------- 1 | error: reference must not have a lifetime 2 | --> $DIR/lifetime-props-param-fail.rs:9:17 3 | | 4 | 9 | fn comp(props: &'static Props) -> Html { 5 | | ^^^^^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/multiple-param-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | fn comp(props: &Props, invalid: String) -> Html { 10 | html! { 11 |

12 | { props.a } 13 | { invalid } 14 |

15 | } 16 | } 17 | 18 | #[function_component(Comp)] 19 | fn comp3(props: &Props, invalid: String, another_invalid: u32) -> Html { 20 | html! { 21 |

22 | { props.a } 23 | { invalid } 24 | { another_invalid } 25 |

26 | } 27 | } 28 | 29 | fn main() {} 30 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/multiple-param-fail.stderr: -------------------------------------------------------------------------------- 1 | error: function components can accept at most one parameter for the props 2 | --> $DIR/multiple-param-fail.rs:9:24 3 | | 4 | 9 | fn comp(props: &Props, invalid: String) -> Html { 5 | | ^^^^^^^^^^^^^^^ 6 | 7 | error: function components can accept at most one parameter for the props 8 | --> $DIR/multiple-param-fail.rs:19:25 9 | | 10 | 19 | fn comp3(props: &Props, invalid: String, another_invalid: u32) -> Html { 11 | | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 12 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/mut-ref-props-param-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[function_component(Comp)] 9 | fn comp(props: &mut Props) -> Html { 10 | html! { 11 |

12 | { props.a } 13 |

14 | } 15 | } 16 | 17 | fn main() {} 18 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/mut-ref-props-param-fail.stderr: -------------------------------------------------------------------------------- 1 | error: reference must not be mutable 2 | --> $DIR/mut-ref-props-param-fail.rs:9:17 3 | | 4 | 9 | fn comp(props: &mut Props) -> Html { 5 | | ^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/no-name-default-pass.rs: -------------------------------------------------------------------------------- 1 | #![no_implicit_prelude] 2 | 3 | #[derive(::yew::prelude::Properties, ::std::prelude::rust_2021::PartialEq,)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | #[::yew::prelude::function_component] 9 | fn Comp(props: &Props) -> ::yew::prelude::Html { 10 | ::yew::prelude::html! { 11 |

12 | { props.a } 13 |

14 | } 15 | } 16 | 17 | fn main() { 18 | let _ = ::yew::prelude::html! { 19 | 20 | }; 21 | } 22 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/with-receiver-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[derive(Clone, Properties, PartialEq)] 4 | struct Props { 5 | a: usize, 6 | } 7 | 8 | struct Test; 9 | 10 | impl Test { 11 | #[function_component(Comp)] 12 | fn comp(self, props: &Props) -> Html { 13 | html! { 14 |

15 | { props.a } 16 |

17 | } 18 | } 19 | } 20 | 21 | fn main() {} 22 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/function_component_attr/with-receiver-fail.stderr: -------------------------------------------------------------------------------- 1 | error: function components can't accept a receiver 2 | --> $DIR/with-receiver-fail.rs:12:13 3 | | 4 | 12 | fn comp(self, props: &Props) -> Html { 5 | | ^^^^ 6 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook-call-generics-pass.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[hook] 4 | fn use_reducer_default_action() -> T::Action 5 | where 6 | T: Reducible + 'static, 7 | T::Action: Default + 'static, 8 | { 9 | T::Action::default() 10 | } 11 | 12 | fn main() {} 13 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook-const-generic-pass.rs: -------------------------------------------------------------------------------- 1 | #![no_implicit_prelude] 2 | 3 | #[::yew::prelude::hook] 4 | fn use_a_const() -> u32 { 5 | N 6 | } 7 | 8 | fn main() {} 9 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook-dynamic-dispatch-pass.rs: -------------------------------------------------------------------------------- 1 | #![no_implicit_prelude] 2 | 3 | #[::yew::prelude::hook] 4 | fn use_boxed_fn(_f: ::std::boxed::Box &str>) { 5 | ::std::todo!() 6 | } 7 | 8 | fn main() {} 9 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook-impl-trait-pass.rs: -------------------------------------------------------------------------------- 1 | // we need to re-test the macro hygiene here as it uses a different implementation for impl traits. 2 | #![no_implicit_prelude] 3 | 4 | #[::yew::prelude::hook] 5 | fn use_some_string(a: impl ::std::convert::Into<::std::string::String>) -> ::std::string::String { 6 | a.into() 7 | } 8 | 9 | #[::yew::prelude::hook] 10 | fn use_impl_fn(_callback: impl ::std::prelude::rust_2021::Fn(&T) -> &U) {} 11 | 12 | fn main() {} 13 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook-lifetime-pass.rs: -------------------------------------------------------------------------------- 1 | #![no_implicit_prelude] 2 | 3 | #[::yew::functional::hook] 4 | fn use_as_is<'a>(input: &'a ()) -> &'a () { 5 | input 6 | } 7 | 8 | fn main() {} 9 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook-return-impl-trait-pass.rs: -------------------------------------------------------------------------------- 1 | #![no_implicit_prelude] 2 | 3 | #[::yew::prelude::hook] 4 | fn use_deref_as_u32() -> impl ::std::ops::Deref { 5 | ::std::rc::Rc::new(0) 6 | } 7 | 8 | fn main() {} 9 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook-return-ref-pass.rs: -------------------------------------------------------------------------------- 1 | #![no_implicit_prelude] 2 | 3 | #[::yew::prelude::hook] 4 | fn use_str_ref(f: &::std::primitive::str) -> &::std::primitive::str { 5 | f 6 | } 7 | 8 | fn main() {} 9 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook-trait-item-pass.rs: -------------------------------------------------------------------------------- 1 | use std::marker::PhantomData; 2 | 3 | pub struct QueryState { 4 | p: PhantomData 5 | } 6 | 7 | pub trait MyTrait { 8 | type Associated; 9 | } 10 | 11 | 12 | #[yew::hook] 13 | pub fn use_query_state( 14 | _selector: impl yew::html::IntoPropValue, 15 | ) -> QueryState 16 | where 17 | Props: MyTrait, 18 | { 19 | QueryState:: { p: PhantomData:: } 20 | } 21 | 22 | fn main() {} -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr/hook_macro-fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | #[hook] 4 | pub fn use_some_macro_inner(val: &str) -> String { 5 | use_state(|| val.to_owned()).to_string() 6 | } 7 | 8 | macro_rules! use_some_macro { 9 | () => { 10 | use_some_macro_inner("default str") 11 | }; 12 | ($t: tt) => { 13 | use_some_macro_inner($t) 14 | }; 15 | } 16 | 17 | #[function_component] 18 | fn Comp() -> Html { 19 | let content = if true { 20 | use_some_macro!() 21 | } else { 22 | use_some_macro!("b") 23 | }; 24 | 25 | html! { 26 |
{content}
27 | } 28 | } 29 | 30 | fn main() {} 31 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_attr_test.rs: -------------------------------------------------------------------------------- 1 | #[allow(dead_code)] 2 | #[rustversion::attr(stable(1.76), test)] 3 | fn tests() { 4 | let t = trybuild::TestCases::new(); 5 | t.pass("tests/hook_attr/*-pass.rs"); 6 | t.compile_fail("tests/hook_attr/*-fail.rs"); 7 | } 8 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/hook_macro_test.rs: -------------------------------------------------------------------------------- 1 | #[allow(dead_code)] 2 | #[rustversion::attr(stable(1.76), test)] 3 | fn tests() { 4 | let t = trybuild::TestCases::new(); 5 | t.pass("tests/hook_macro/*-pass.rs"); 6 | t.compile_fail("tests/hook_macro/*-fail.rs"); 7 | } 8 | -------------------------------------------------------------------------------- /packages/yew-macro/tests/html_lints/fail.rs: -------------------------------------------------------------------------------- 1 | use yew::prelude::*; 2 | 3 | fn main() { 4 | let bad_a = html! { 5 | { "I don't have a href attribute" } 6 | }; 7 | let bad_a_2 = html! { 8 | { "I have a malformed href attribute" } 9 | }; 10 | let bad_a_3 = html! { 11 | { "I have a malformed href attribute" } 12 | }; 13 | let bad_img = html! { 14 | 15 | }; 16 | let misformed_tagname = html! { 17 |