Macro callback 

macro_rules! callback {
    ([$($dep:ident),*], || $result:expr) => { ... };
    ([$($dep:ident),*], |_ $(: $Type:ty)?| $result:expr) => { ... };
    ([$($dep:ident),*], |$($arg:ident $(: $Type:ty)?),+| $result:expr) => { ... };
}

Available on crate feature client only.

A thin shorthand for creating closures of clone-and-move pattern.

This is useful when creating event handlers or callbacks using signals:

use uibeam::{UI, Beam, Signal, callback};
use uibeam::client::{InputEvent, PointerEvent};
use wasm_bindgen::JsCast;
use web_sys::HtmlInputElement;

struct ClientBeam;

#[uibeam::client]
impl Beam for ClientBeam {
    fn render(self) -> UI {
        let name = Signal::new("Alice".to_owned());
        let count = Signal::new(0);

        let handle_name_input = callback!([name], |e: InputEvent| {
            let input_element: HtmlInputElement = e
                .current_target().unwrap()
                .dyn_into().unwrap();
            name.set(input_element.value());
        });

        let handle_increment_click = callback!([count], |_: PointerEvent| {
            count.set(*count + 1);
        });

        todo!()
    }
}

Example

use uibeam::{UI, Beam, Signal, callback};

#[derive(serde::Serialize, serde::Deserialize)]
pub struct Counter {
    pub initial_count: i32,
}

#[uibeam::client(island)]
impl Beam for Counter {
    fn render(self) -> UI {
        let count = Signal::new(self.initial_count);

        let increment = callback!([count], |_| {
            count.set(*count + 1);
        });

        let decrement = callback!([count], |_| {
            count.set(*count - 1);
        });

        UI! {
            <div class="w-[144px]">
                <p class="text-2xl font-bold text-center">
                    "Count: "{*count}
                </p>
                <div class="text-center">
                    <button
                        class="cursor-pointer bg-red-500  w-[32px] py-1 text-white rounded-md"
                        onclick={decrement}
                    >"-"</button>
                    <button
                        class="cursor-pointer bg-blue-500 w-[32px] py-1 text-white rounded-md"
                        onclick={increment}
                    >"+"</button>
                </div>
            </div>
        }
    }
}