docs: big updates to the reference

packages/core-macro/src/rsx/ambiguous.rs

@@ -39,32 +39,18 @@ impl Parse for AmbiguousElement {
             }
         }
 
-        // if input.peek(Ident) {
-        //     let name_str = input.fork().parse::<Ident>().unwrap().to_string();
-        // } else {
-        // }
-
         if let Ok(name) = input.fork().parse::<Ident>() {
             let name_str = name.to_string();
 
-            match is_valid_tag(&name_str) {
-                true => input
+            let first_char = name_str.chars().next().unwrap();
+            if first_char.is_ascii_uppercase() {
+                input
+                    .parse::<Component>()
+                    .map(|c| AmbiguousElement::Component(c))
+            } else {
+                input
                     .parse::<Element>()
-                    .map(|c| AmbiguousElement::Element(c)),
-                false => {
-                    let first_char = name_str.chars().next().unwrap();
-                    if first_char.is_ascii_uppercase() {
-                        input
-                            .parse::<Component>()
-                            .map(|c| AmbiguousElement::Component(c))
-                    } else {
-                        let name = input.parse::<Ident>().unwrap();
-                        Err(Error::new(
-                            name.span(),
-                            "Components must be uppercased, perhaps you mispelled a html tag",
-                        ))
-                    }
-                }
+                    .map(|c| AmbiguousElement::Element(c))
             }
         } else {
             if input.peek(LitStr) {

packages/core-macro/src/rsx/component.rs

@@ -96,7 +96,7 @@ pub fn parse_component_body(
             }
             content.parse::<Token![..]>()?;
             *manual_props = Some(content.parse::<Expr>()?);
-        } else if content.peek(Ident) && content.peek2(Token![:]) {
+        } else if content.peek(Ident) && content.peek2(Token![:]) && !content.peek3(Token![:]) {
             if !cfg.allow_fields {
                 return Err(Error::new(
                     content.span(),
@@ -184,7 +184,7 @@ impl ToTokens for Component {
         };
 
         tokens.append_all(quote! {
-            __cx.virtual_child(
+            __cx.component(
                 #name,
                 #builder,
                 #key_token,

packages/core-macro/src/rsx/element.rs

@@ -43,11 +43,6 @@ impl Parse for Element {
     fn parse(stream: ParseStream) -> Result<Self> {
         let name = Ident::parse(stream)?;
 
-        // TODO: remove this in favor of the compile-time validation system
-        if !crate::util::is_valid_tag(&name.to_string()) {
-            return Err(Error::new(name.span(), "Not a valid Html tag"));
-        }
-
         // parse the guts
         let content: ParseBuffer;
         syn::braced!(content in stream);

packages/core/examples/alternative.rs

@@ -4,7 +4,7 @@ fn main() {}
 // use dioxus_core as dioxus;
 // use dioxus_core::prelude::*;
 
-// static Example: FC<()> = |cx| {
+// pub static Example: FC<()> = |cx| {
 //     let list = (0..10).map(|f| LazyNodes::new(move |f| todo!()));
 
 //     cx.render(LazyNodes::new(move |cx| {

packages/core/examples/contextapi.rs

@@ -5,12 +5,8 @@ struct SomeContext {
     items: Vec<String>,
 }
 
-struct Props {
-    name: String,
-}
-
 #[allow(unused)]
-static Example: FC<Props> = |cpt| {
+static Example: FC<()> = |cpt| {
     todo!()
 
     // let value = cx.use_context(|c: &SomeContext| c.items.last().unwrap());

packages/core/src/context.rs

@@ -321,7 +321,10 @@ Any function prefixed with "use" should not be called conditionally.
     ///
     ///
     ///
-    pub fn use_task<Out, Fut, Init>(&self, task_initializer: Init) -> (&TaskHandle, &Option<Out>)
+    pub fn use_task<Out, Fut, Init>(
+        self,
+        task_initializer: Init,
+    ) -> (TaskHandle<'src>, &'src Option<Out>)
     where
         Out: 'static,
         Fut: Future<Output = Out> + 'static,
@@ -363,7 +366,7 @@ Any function prefixed with "use" should not be called conditionally.
                 if let Some(val) = hook.task_dump.as_ref().borrow_mut().take() {
                     hook.value = Some(val);
                 }
-                (&TaskHandle { _p: PhantomData }, &hook.value)
+                (TaskHandle { _p: PhantomData }, &hook.value)
             },
             |_| {},
         )
@@ -463,6 +466,14 @@ impl<'src, P> Context<'src, P> {
     }
 }
 
+#[derive(Clone, Copy)]
 pub struct TaskHandle<'src> {
     _p: PhantomData<&'src ()>,
 }
+
+impl<'src> TaskHandle<'src> {
+    pub fn toggle(&self) {}
+    pub fn start(&self) {}
+    pub fn stop(&self) {}
+    pub fn restart(&self) {}
+}

packages/core/src/nodes.rs

@@ -266,7 +266,7 @@ impl<'a> NodeFactory<'a> {
         }
     }
 
-    pub fn virtual_child<P>(
+    pub fn component<P>(
         &self,
         component: FC<P>,
         props: P,

packages/hooks/src/usestate.rs

@@ -123,7 +123,14 @@ impl<'a, T: 'static> UseState<'a, T> {
         let slot = self.inner.wip.clone();
         Rc::new(move |new| *slot.borrow_mut() = Some(new))
     }
+
+    pub fn for_async(&self) -> AsyncUseState<T> {
+        AsyncUseState {
+            wip: self.inner.wip.clone(),
+        }
+    }
 }
+
 impl<'a, T: 'static + ToOwned<Owned = T>> UseState<'a, T> {
     pub fn get_mut(self) -> RefMut<'a, T> {
         // make sure we get processed
@@ -175,9 +182,55 @@ impl<'a, T: Copy + Sub<T, Output = T>> SubAssign<T> for UseState<'a, T> {
     }
 }
 
+/// MUL
+impl<'a, T: Copy + Mul<T, Output = T>> Mul<T> for UseState<'a, T> {
+    type Output = T;
+
+    fn mul(self, rhs: T) -> Self::Output {
+        self.inner.current_val.mul(rhs)
+    }
+}
+impl<'a, T: Copy + Mul<T, Output = T>> MulAssign<T> for UseState<'a, T> {
+    fn mul_assign(&mut self, rhs: T) {
+        self.set(self.inner.current_val.mul(rhs));
+    }
+}
+/// DIV
+impl<'a, T: Copy + Div<T, Output = T>> Div<T> for UseState<'a, T> {
+    type Output = T;
+
+    fn div(self, rhs: T) -> Self::Output {
+        self.inner.current_val.div(rhs)
+    }
+}
+impl<'a, T: Copy + Div<T, Output = T>> DivAssign<T> for UseState<'a, T> {
+    fn div_assign(&mut self, rhs: T) {
+        self.set(self.inner.current_val.div(rhs));
+    }
+}
+
 // enable displaty for the handle
 impl<'a, T: 'static + Display> std::fmt::Display for UseState<'a, T> {
     fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
         write!(f, "{}", self.inner.current_val)
     }
 }
+
+/// A less ergonmic but still capable form of use_state that's valid for `static lifetime
+pub struct AsyncUseState<T: 'static> {
+    wip: Rc<RefCell<Option<T>>>,
+}
+
+impl<T: ToOwned> AsyncUseState<T> {
+    pub fn get_mut<'a>(&'a self) -> RefMut<'a, T> {
+        // make sure we get processed
+        // self.needs_update();
+
+        // Bring out the new value, cloning if it we need to
+        // "get_mut" is locked behind "ToOwned" to make it explicit that cloning occurs to use this
+        RefMut::map(self.wip.borrow_mut(), |slot| {
+            //
+            slot.as_mut().unwrap()
+        })
+    }
+}

packages/html/src/lib.rs

@@ -924,6 +924,8 @@ builder_constructors! {
     /// [`<div>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div)
     /// element.
     ///
+    /// Part of the HTML namespace. Only works in HTML-compatible renderers
+    ///
     /// ## Definition and Usage
     /// - The <div> tag defines a division or a section in an HTML document.
     /// - The <div> tag is used as a container for HTML elements - which is then styled with CSS or manipulated with  JavaScript.
@@ -1575,6 +1577,7 @@ builder_constructors! {
     /// [`<select>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select)
     /// element.
     select {
+        value: String,
         autocomplete: String,
         autofocus: Bool,
         disabled: Bool,

packages/mobile/src/lib.rs

@@ -9,7 +9,8 @@ use wry::application::window::Fullscreen;
 use wry::application::{
     dpi::LogicalSize,
     event::StartCause,
-    platform::ios::{ScreenEdge, WindowBuilderExtIOS, WindowExtIOS},
+    // platform::ios::{ScreenEdge, WindowBuilderExtIOS, WindowExtIOS},
+    // platform::ios::{ScreenEdge, WindowBuilderExtIOS, WindowExtIOS},
 };
 use wry::webview::WebViewBuilder;
 use wry::{
@@ -23,7 +24,7 @@ fn init_logging() {
     simple_logger::SimpleLogger::new().init().unwrap();
 }
 
-static HTML_CONTENT: &'static str = include_str!("./../../webview/src/index.html");
+static HTML_CONTENT: &'static str = include_str!("../../desktop/src/index.html");
 
 pub fn launch(root: FC<()>, builder: fn(WindowBuilder) -> WindowBuilder) -> anyhow::Result<()> {
     launch_with_props(root, (), builder)

packages/ssr/examples/tide.rs

@@ -38,7 +38,7 @@ struct ExampleProps {
     initial_name: String,
 }
 
-static Example: FC<ExampleProps> = |cx| {
+pub static Example: FC<ExampleProps> = |cx| {
     let dispaly_name = use_state(cx, move || cx.initial_name.clone());
 
     cx.render(rsx! {

packages/ssr/examples/tofile.rs

@@ -19,7 +19,7 @@ fn main() {
         .unwrap();
 }
 
-pub const App: FC<()> = |cx| {
+pub static App: FC<()> = |cx| {
     cx.render(rsx!(
         div { class: "overflow-hidden"
             link { href:"https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel:"stylesheet" }
@@ -34,7 +34,7 @@ pub const App: FC<()> = |cx| {
     ))
 };
 
-pub const Header: FC<()> = |cx| {
+pub static Header: FC<()> = |cx| {
     cx.render(rsx! {
         div {
             header { class: "text-gray-400 bg-gray-900 body-font"
@@ -60,7 +60,7 @@ pub const Header: FC<()> = |cx| {
     })
 };
 
-pub const Hero: FC<()> = |cx| {
+pub static Hero: FC<()> = |cx| {
     //
     cx.render(rsx! {
         section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -98,7 +98,7 @@ pub const Hero: FC<()> = |cx| {
         }
     })
 };
-pub const Entry: FC<()> = |cx| {
+pub static Entry: FC<()> = |cx| {
     //
     cx.render(rsx! {
         section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -111,7 +111,7 @@ pub const Entry: FC<()> = |cx| {
     })
 };
 
-pub const StacksIcon: FC<()> = |cx| {
+pub static StacksIcon: FC<()> = |cx| {
     cx.render(rsx!(
         svg {
             // xmlns: "http://www.w3.org/2000/svg"
@@ -126,7 +126,7 @@ pub const StacksIcon: FC<()> = |cx| {
         }
     ))
 };
-pub const RightArrowIcon: FC<()> = |cx| {
+pub static RightArrowIcon: FC<()> = |cx| {
     cx.render(rsx!(
         svg {
             fill: "none"

packages/web/examples/demo.rs

@@ -25,7 +25,7 @@ fn main() {
     wasm_bindgen_futures::spawn_local(WebsysRenderer::start(App));
 }
 
-pub const App: FC<()> = |cx| {
+pub static App: FC<()> = |cx| {
     cx.render(rsx!(
         div { class: "overflow-hidden"
             link { href:"https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel:"stylesheet" }
@@ -40,7 +40,7 @@ pub const App: FC<()> = |cx| {
     ))
 };
 
-pub const Header: FC<()> = |cx| {
+pub static Header: FC<()> = |cx| {
     cx.render(rsx! {
         div {
             header { class: "text-gray-400 bg-gray-900 body-font"
@@ -66,7 +66,7 @@ pub const Header: FC<()> = |cx| {
     })
 };
 
-pub const Hero: FC<()> = |cx| {
+pub static Hero: FC<()> = |cx| {
     //
     cx.render(rsx! {
         section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -104,7 +104,7 @@ pub const Hero: FC<()> = |cx| {
         }
     })
 };
-pub const Entry: FC<()> = |cx| {
+pub static Entry: FC<()> = |cx| {
     //
     cx.render(rsx! {
         section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -117,7 +117,7 @@ pub const Entry: FC<()> = |cx| {
     })
 };
 
-pub const StacksIcon: FC<()> = |cx| {
+pub static StacksIcon: FC<()> = |cx| {
     cx.render(rsx!(
         svg {
             // xmlns: "http://www.w3.org/2000/svg"
@@ -132,7 +132,7 @@ pub const StacksIcon: FC<()> = |cx| {
         }
     ))
 };
-pub const RightArrowIcon: FC<()> = |cx| {
+pub static RightArrowIcon: FC<()> = |cx| {
     cx.render(rsx!(
         svg {
             fill: "none"