Callout

use hydroxy_leptos::callout::{Callout, CalloutKind};
use leptos::prelude::*;

pub fn demo() -> AnyView {
    view! {
        <div style="display: grid; gap: var(--space-4);">
            <Callout title="Sources are attached">
                "Each answer lists the files it read, with the page for each figure."
            </Callout>
            <Callout kind=CalloutKind::Tip title="Compare two exports">
                "Drop both files in and ask what changed between them."
            </Callout>
            <Callout kind=CalloutKind::Warning title="Two items need your judgement">
                "The September export has 410 fewer tickets than the August summary."
            </Callout>
            <Callout kind=CalloutKind::Danger title="Deleting removes 12 files">
                "Summaries that cite them lose their sources. This can't be undone."
            </Callout>
            <Callout>"A callout can be a single line with no title."</Callout>
        </div>
    }
    .into_any()
}

use dioxus::prelude::*;
use hydroxy_dioxus::callout::{Callout, CalloutKind};

#[component]
pub fn CalloutDemo() -> Element {
    rsx! {
        div { style: "display: grid; gap: var(--space-4);",
            Callout { title: "Sources are attached",
                "Each answer lists the files it read, with the page for each figure."
            }
            Callout { kind: CalloutKind::Tip, title: "Compare two exports",
                "Drop both files in and ask what changed between them."
            }
            Callout { kind: CalloutKind::Warning, title: "Two items need your judgement",
                "The September export has 410 fewer tickets than the August summary."
            }
            Callout { kind: CalloutKind::Danger, title: "Deleting removes 12 files",
                "Summaries that cite them lose their sources. This can't be undone."
            }
            Callout { "A callout can be a single line with no title." }
        }
    }
}