Function dialog_provider

pub fn dialog_provider(
    args: DialogProviderArgs,
    state: Arc<RwLock<DialogProviderState>>,
    main_content: impl FnOnce(),
    dialog_content: impl FnOnce(f32),
)

A provider component that manages the rendering and event flow for a modal dialog.

This component should be used as one of the outermost layers of the application. It renders the main content, and when is_open is true, it overlays a modal dialog, intercepting all input events to create a modal experience.

The dialog can be closed by calling the on_close_request callback, which can be triggered by clicking the background scrim or pressing the ESC key.

Arguments

• args - The arguments for configuring the dialog provider. See DialogProviderArgs.
• main_content - A closure that renders the main content of the application, which is visible whether the dialog is open or closed.
• dialog_content - A closure that renders the content of the dialog, which is only visible when args.is_open is true.

Example

use std::sync::Arc;

use parking_lot::RwLock;
use tessera_ui::Color;
use tessera_ui_basic_components::{
    dialog::{DialogProviderArgsBuilder, DialogProviderState, dialog_provider},
    button::{ButtonArgsBuilder, button},
    text::{TextArgsBuilder, text},
    ripple_state::RippleState,
};

#[derive(Default)]
struct State {
    show_dialog: bool,
}

// ...

dialog_provider(
    DialogProviderArgsBuilder::default()
        .on_close_request(Arc::new({
            let state = state.clone();
            move || state.write().show_dialog = false
        }))
        .build()
        .unwrap(),
    dialog_state.clone(),
    // Main content
    {
        let state = state.clone();
        let ripple = ripple_state.clone();
        let dialog_state = dialog_state.clone();
        move || {
            button(
                ButtonArgsBuilder::default()
                    .on_click(Arc::new(move || {
                        state.write().show_dialog = true;
                        dialog_state.write().open();
                    }))
                    .build()
                    .unwrap(),
                ripple, // ripple state
                || {
                    text(
                        TextArgsBuilder::default()
                            .text("Show Dialog".to_string())
                            .build()
                            .unwrap(),
                    );
                },
            );
        }
    },
    // Dialog content
    {
        let state = state.clone();
        let ripple = ripple_state.clone();
        let dialog_state = dialog_state.clone();
        move |content_alpha| {
            button(
                ButtonArgsBuilder::default()
                    .color(Color::GREEN.with_alpha(content_alpha))
                    .on_click(Arc::new(move || {
                        state.write().show_dialog = false;
                        dialog_state.write().close();
                    }))
                    .build()
                    .unwrap(),
                ripple,
                || {
                    text(
                        TextArgsBuilder::default()
                            .color(Color::BLACK.with_alpha(content_alpha))
                            .text("Dialog Content".to_string())
                            .build()
                            .unwrap(),
                    );
                },
            );
        }
    },
);