#[component] 与 Props

#[component]
fn Row(label: String, count: i32) -> Element {
  rsx! { "{label}: {count}" }
}

///Properties for the [`Row`] component.
#[allow(missing_docs)]
#[allow(non_camel_case_types)]
struct RowProps {
    label: String,
    count: i32,
}
// ... RowProps::builder()、RowPropsBuilder、impl Properties（见下文）
impl ::core::clone::Clone for RowProps {
    #[inline]
    fn clone(&self) -> Self {
        Self {
            label: ::core::clone::Clone::clone(&self.label),
            count: ::core::clone::Clone::clone(&self.count),
        }
    }
}
impl ::core::cmp::PartialEq for RowProps {
    #[inline]
    fn eq(&self, other: &Self) -> bool {
        self.label == other.label && self.count == other.count && true
    }
}
#[allow(non_snake_case)]
fn Row(RowProps { mut label, mut count }: RowProps) -> Element {
    {
        {
            dioxus_core::Element::Ok({
                // ... rsx! 的展开
            })
        }
    }
}
// ... mod Row_completions { pub enum Component { Row {} } }，只为编辑器补全

#[derive(Clone)]
struct Config {
  depth: u32,
}

#[component]
fn Panel(config: Config) -> Element {
  rsx! { "{config.depth}" }
}

error[E0369]: binary operation `==` cannot be applied to type `Config`
 --> src/main.rs:8:1
  |
8 | #[component]
  | ^^^^^^^^^^^^
  |
note: an implementation of `PartialEq` might be missing for `Config`
 --> src/main.rs:4:1
  |
4 | struct Config {
  | ^^^^^^^^^^^^^ must implement `PartialEq`
  = note: this error originates in the attribute macro `component` (in Nightly builds, run with -Z macro-backtrace for more info)
help: consider annotating `Config` with `#[derive(PartialEq)]`
  |
4 + #[derive(PartialEq)]
5 | struct Config {
  |

            dioxus_core::DynamicNode::Component({
                use dioxus_core::Properties;
                let __comp = ({
                    dioxus_core::fc_to_builder(Row)
                        .label({ { "a" } })
                        .count({ { 1 } })
                        .build()
                })
                    .into_vcomponent(Row);
                __comp
            }),

    fn builder() -> RowPropsBuilder<((), ())> {
        RowPropsBuilder {
            fields: ((), ()),
            _phantom: ::core::default::Default::default(),
        }
    }
// ...
impl<__count> RowPropsBuilder<((), __count)> {
    #[allow(clippy::type_complexity)]
    pub fn label(
        self,
        label: impl ::core::fmt::Display,
    ) -> RowPropsBuilder<((String,), __count)> {
        let label = (label.to_string(),);
        let (_, count) = self.fields;
        RowPropsBuilder {
            fields: (label, count),
            _phantom: self._phantom,
        }
    }
}
// ...
impl RowPropsBuilder<((String,), (i32,))> {
    pub fn build(self) -> RowProps {
        let (label, count) = self.fields;
        let label = label.0;
        let count = count.0;
        RowProps { label, count }
    }
}

warning: use of deprecated method `RowPropsBuilder::<((std::string::String,), ())>::build`: Missing required field count
 --> src/bin/missing_field.rs:9:14
  |
9 |   rsx! { Row { label: "a" } }
  |              ^^^^^^^^^^^^^^
  |
  = note: `#[warn(deprecated)]` on by default

error[E0061]: this method takes 1 argument but 0 arguments were supplied
 --> src/bin/missing_field.rs:9:14
  |
9 |   rsx! { Row { label: "a" } }
  |              ^^^^^^^^^^^^^^ argument #1 of type `RowPropsBuilder_Error_Missing_required_field_count` is missing
...

#[component]
fn Badge(
  // String fields take `impl Display`
  label: String,
  // Option<T> fields are optional and accept a bare T
  title: Option<String>,
  #[props(default = 3)] size: u8,
  #[props(into)] width: f64,
  #[props(extends = GlobalAttributes)] attributes: Vec<Attribute>,
  children: Element,
) -> Element {
  rsx! {
    span { title, "data-size": "{size}", "data-width": "{width}", ..attributes,
      "{label}"
      {children}
    }
  }
}

fn app() -> Element {
  rsx! {
    Badge { label: 42, width: 2u8 }
    Badge { label: "new", title: "hi", size: 1, width: 1.5f32, id: "b2", class: "x", em { "!" } }
  }
}

<span data-size="3" data-width="2">42</span><span title="hi" data-size="1" data-width="1.5" id="b2" class="x">new<em>!</em></span>

pub trait Properties: Clone + Sized + 'static {
    /// The type of the builder for this component.
    /// Used to create "in-progress" versions of the props.
    type Builder;

    /// Create a builder for this component.
    fn builder() -> Self::Builder;

    /// Make the old props equal to the new props. Return if the props were equal and should be memoized.
    fn memoize(&mut self, other: &Self) -> bool;

    /// Create a component from the props.
    fn into_vcomponent<M: 'static>(self, render_fn: impl ComponentFunction<Self, M>) -> VComponent {
        let type_name = std::any::type_name_of_val(&render_fn);
        VComponent::new(render_fn, self, type_name)
    }
}

    fn memoize(&mut self, new: &Self) -> bool {
        let equal = self == new;
        if !equal {
            let new_clone = new.clone();
            self.label = new_clone.label;
            self.count = new_clone.count;
        }
        equal
    }

#[component]
fn Fixed(n: i32) -> Element {
  ran("Fixed");
  rsx! { "{n}" }
}

#[component]
fn Varying(n: i32) -> Element {
  ran("Varying");
  rsx! { "{n}" }
}

#[component]
fn WithHandler(onclick: EventHandler<()>) -> Element {
  ran("WithHandler");
  rsx! { button { onclick: move |_| onclick.call(()), "x" } }
}

#[component]
fn WithChildren(children: Element) -> Element {
  ran("WithChildren");
  rsx! { div { {children} } }
}

#[component]
fn SigRead(n: ReadSignal<i32>) -> Element {
  ran("SigRead");
  rsx! { "{n}" }
}

#[component]
fn SigNoRead(n: ReadSignal<i32>) -> Element {
  ran("SigNoRead");
  rsx! { "static" }
}

#[component]
fn NoProps() -> Element {
  ran("NoProps");
  rsx! { "none" }
}

fn app() -> Element {
  ran("app");
  let tick = TICK.with(|t| t.get());
  rsx! {
    Fixed { n: 1 }
    Varying { n: tick }
    WithHandler { onclick: move |_| {} }
    WithChildren { span { "hi" } }
    SigRead { n: tick }
    SigNoRead { n: tick }
    NoProps {}
  }
}

async fn settle(dom: &mut VirtualDom) {
  dom.render_immediate_to_vec();
  report("  after 1st render_immediate");
  // pick up scopes that were marked dirty by signals during the diff
  while tokio::time::timeout(Duration::from_millis(20), dom.wait_for_work()).await.is_ok() {
    dom.render_immediate_to_vec();
  }
}

#[tokio::main(flavor = "current_thread")]
async fn main() {
  let mut dom = VirtualDom::new(app);
  dom.rebuild_to_vec();
  report("rebuild");

  dom.mark_dirty(ScopeId::APP);
  settle(&mut dom).await;
  report("app rerun, tick unchanged");

  TICK.with(|t| t.set(1));
  dom.mark_dirty(ScopeId::APP);
  settle(&mut dom).await;
  report("app rerun, tick 0 -> 1");
}

rebuild                      Fixed=1 NoProps=1 SigNoRead=1 SigRead=1 Varying=1 WithChildren=1 WithHandler=1 app=1
  after 1st render_immediate Fixed=1 NoProps=1 SigNoRead=1 SigRead=1 Varying=1 WithChildren=2 WithHandler=2 app=2
app rerun, tick unchanged    Fixed=1 NoProps=1 SigNoRead=1 SigRead=1 Varying=1 WithChildren=2 WithHandler=2 app=2
  after 1st render_immediate Fixed=1 NoProps=1 SigNoRead=1 SigRead=1 Varying=2 WithChildren=3 WithHandler=3 app=3
app rerun, tick 0 -> 1       Fixed=1 NoProps=1 SigNoRead=1 SigRead=2 Varying=2 WithChildren=3 WithHandler=3 app=3

impl<Args, Ret> PartialEq for Callback<Args, Ret> {
    fn eq(&self, other: &Self) -> bool {
        self.callback.ptr_eq(&other.callback) && self.origin == other.origin
    }
}

#[component]
fn WithHandler(onclick: EventHandler<()>) -> Element {
  RUNS.with(|r| r.set(r.get() + 1));
  rsx! { button { onclick: move |_| onclick.call(()), "x" } }
}

fn app() -> Element {
  let cb = use_callback(move |_: ()| {});
  rsx! { WithHandler { onclick: cb } }
}

fn main() {
  let mut dom = VirtualDom::new(app);
  dom.rebuild_to_vec();
  for _ in 0..3 {
    dom.mark_dirty(ScopeId::APP);
    dom.render_immediate_to_vec();
  }
  println!("app rendered 4 times, WithHandler ran {} times", RUNS.with(|r| r.get()));
}

app rendered 4 times, WithHandler ran 1 times

                Ok(quote! {
                    // First check if the fields are equal. This will compare the signal fields by pointer
                    let exactly_equal = self == new;
                    if exactly_equal {
                        // If they are return early, they can be memoized without any changes
                        return true;
                    }

                    // If they are not, move the signal fields into self and check if they are equal now that the signal fields are equal
                    #(
                        let mut #signal_fields = self.#signal_fields;
                        self.#signal_fields = new.#signal_fields;
                    )*

                    // Then check if the fields are equal now that we know the signal fields are equal
                    // NOTE: we don't compare other fields individually because we want to let users opt-out of memoization for certain fields by implementing PartialEq themselves
                    let non_signal_fields_equal = self == new;

                    // If they are not equal, we need to move over all the fields that are not event handlers or signals to self
                    if !non_signal_fields_equal {
                        let new_clone = new.clone();
                        #(
                            self.#regular_fields = new_clone.#regular_fields;
                        )*
                    }
                    // Move any signal and event fields into their old container.
                    // We update signals and event handlers in place so that they are always up to date even if they were moved into a future in a previous render
                    #move_signal_fields
                    #move_event_handlers

                    non_signal_fields_equal
                })