use_web_notification

Usage

use leptos::prelude::*;
use leptos_use_web_notification::{use_web_notification_with_options, UseWebNotificationOptions, ShowOptions, UseWebNotificationReturn, NotificationDirection};

#[component]
fn Demo() -> impl IntoView {
let UseWebNotificationReturn {
    show,
    close,
    ..
} = use_web_notification_with_options(
    UseWebNotificationOptions::default()
        .direction(NotificationDirection::Auto)
        .language("en")
        .renotify(true)
        .tag("test"),
);

show(ShowOptions::default().title("Hello World from leptos-use"));

view! { }
}

Server-Side Rendering

Make sure you follow the instructions in Server-Side Rendering.

This function is basically ignored on the server. You can safely call show but it will do nothing.

Installation

cargo add leptos-use-web-notification

Options

`ShowOptions`

Options for UseWebNotificationReturn::show.

This can be used to override options passed to use_web_notification. See MDN Docs for more info.

The following implementations are missing:

Every option is set with a builder method of the same name, e.g. ShowOptions::default().title(...). See also the API docs.

`title`

Type: Option<String>

The title property of the Notification interface indicates the title of the notification

`body`

Type: Option<String>

The body string of the notification as specified in the constructor’s options parameter.

The text direction of the notification as specified in the constructor’s options parameter. Can be LeftToRight, RightToLeft or Auto (default). See web_sys::NotificationDirection for more info.

`language`

Type: Option<String>

The language code of the notification as specified in the constructor’s options parameter.

`tag`

Type: Option<String>

The ID of the notification(if any) as specified in the constructor’s options parameter.

`icon`

Type: Option<String>

The URL of the image used as an icon of the notification as specified in the constructor’s options parameter.

`image`

Type: Option<String>

The URL of the image to be displayed as part of the notification as specified in the constructor’s options parameter.

`require_interaction`

Type: Option<bool>

A boolean value indicating that a notification should remain active until the user clicks or dismisses it, rather than closing automatically.

`renotify`

Type: Option<bool>

A boolean value specifying whether the user should be notified after a new notification replaces an old one. The default is false, which means they won’t be notified. If true, then tag also must be set.

`silent`

Type: Option<bool>

A boolean value specifying whether the notification should be silent, regardless of the device settings. The default is null, which means the notification is not silent. If true, then the notification will be silent.

`vibrate`

Type: Option<Vec<u16>>

A Vec<u16> specifying the vibration pattern in milliseconds for vibrating and not vibrating. The last entry can be a vibration since it stops automatically after each period.