nova_forms/components/
dialog.rs

1use leptos::*;
2
3use crate::Button;
4
5/// The kind of dialog to display.
6/// There are four kinds of dialogs: success, info, warn, and error.
7#[derive(Copy, Clone, Debug)]
8pub enum DialogKind {
9    Success,
10    Info,
11    Warn,
12    Error,
13}
14
15impl DialogKind {
16    pub fn class(&self) -> &'static str {
17        match self {
18            DialogKind::Success => "success",
19            DialogKind::Info => "info",
20            DialogKind::Warn => "warn",
21            DialogKind::Error => "error",
22        }
23    }
24}
25
26/// A dialog component.
27#[component]
28pub fn Dialog(
29    /// The kind of dialog to display.
30    kind: DialogKind,
31    /// Whether the dialog is open.
32    #[prop(into, optional, default=true.into())] open: MaybeSignal<bool>,
33    /// The callback to close the dialog.
34    #[prop(into, optional)] close: Option<Callback<(), ()>>,
35    /// The title of the dialog.
36    #[prop(into)] title: TextProp,
37    /// The message of the dialog.
38    #[prop(into)] msg: TextProp,
39) -> impl IntoView {
40    view! {
41        <Show when=move || open.get()>
42            <dialog 
43                open=open.get()
44                class=format!("dialog {}", kind.class())
45                tabindex="-1"
46            >
47                <div class="dialog-header">{
48                    let title = title.clone();
49                    move || title.clone()
50                }</div>
51                <div class="dialog-main">{
52                    let msg = msg.clone();
53                    move || msg.clone()
54                }</div>
55                {
56                    if let Some(close) = close {
57                        view! {
58                            <div class="dialog-footer">
59                                <Button icon="close" label="Close" on:click=move |_ev| close.call(()) />
60                            </div>
61                        }.into_view()
62                    } else {
63                        View::default()
64                    }
65                }
66            </dialog>
67        </Show>
68    }
69}