dioxus_clerk/components/sign_out_button.rs
1use crate::options::SignOutOptions;
2use dioxus::prelude::*;
3
4/// Unstyled sign-out button that schedules `Clerk.signOut(...)`.
5///
6/// This component renders a native `<button>` and treats `children` as button
7/// contents. For design-system buttons that own their own DOM element, call
8/// [`crate::use_clerk`] from the button's click handler instead.
9///
10/// # Example
11///
12/// ```no_run
13/// use dioxus::prelude::*;
14/// use dioxus_clerk::*;
15///
16/// #[component]
17/// fn SignOutAction() -> Element {
18/// rsx! {
19/// SignOutButton { class: "btn btn-ghost", redirect_url: "/", "Sign out" }
20/// }
21/// }
22/// ```
23#[component]
24pub fn SignOutButton(
25 /// Full URL or path to navigate to after sign-out.
26 #[props(into)]
27 redirect_url: Option<String>,
28 /// Sign out a specific session id in multi-session applications.
29 #[props(into)]
30 session_id: Option<String>,
31 /// Advanced options forwarded to Clerk, as a
32 /// [`SignOutOptions`](crate::SignOutOptions) builder or a raw
33 /// `serde_json::Value`. Explicit props win when both set the same Clerk
34 /// option key.
35 #[props(default = SignOutOptions::from_value(serde_json::Value::Null), into)]
36 options: SignOutOptions,
37 /// Disable the generated `<button>`.
38 #[props(default)]
39 disabled: bool,
40 /// Attributes spread onto the generated `<button>` (`id`, `class`,
41 /// `title`, `aria-*`, `r#type`, ...). `r#type` defaults to `"button"` to
42 /// avoid accidental form submits.
43 #[props(extends = GlobalAttributes, extends = button)]
44 attributes: Vec<Attribute>,
45 /// Optional click handler, called before the sign-out action is scheduled
46 /// (matching Clerk React's ordering).
47 #[props(default, into)]
48 onclick: Callback<MouseEvent>,
49 /// Optional custom button contents. Defaults to `Sign out`.
50 #[props(default = rsx! { "Sign out" })]
51 children: Element,
52) -> Element {
53 let options = options
54 .maybe_redirect_url(redirect_url)
55 .maybe_session_id(session_id)
56 .into_value();
57
58 let clerk = crate::use_clerk();
59 super::button_host::button_host(
60 super::button_host::ButtonChrome {
61 attributes,
62 disabled,
63 onclick,
64 children,
65 },
66 move || clerk.sign_out_with_options(options.clone()),
67 )
68}