yew-nav-link 0.9.0

Navigation link component for Yew with automatic active state detection
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117

//! # `PageLink`
//!
//! Link or span element within a pagination page item.
//! Renders an `<a>` when `href` is set, otherwise a `<span>`.
//!
//! # Example
//!
//! ```rust
//! use yew::prelude::*;
//! use yew_nav_link::components::{PageItem, PageLink};
//!
//! #[component]
//! fn PaginationNav() -> Html {
//!     html! {
//!         <nav><ul class="pagination">
//!             <PageItem page={1} active=true>
//!                 <PageLink href={Some("/page/1")}>{ "1" }</PageLink>
//!             </PageItem>
//!             <PageItem page={0} disabled=true>
//!                 <PageLink href={None}>{ "..." }</PageLink>
//!             </PageItem>
//!         </ul></nav>
//!     }
//! }
//! ```
//!
//! # CSS Classes
//!
//! | Class | Condition |
//! |-------|-----------|
//! | `page-link` | Always applied |
//!
//! # Props
//!
//! | Prop | Type | Default | Description |
//! |------|------|---------|-------------|
//! | `href` | `Option<&'static str>` | `None` | Link URL |
//! | `classes` | `Classes` | — | Additional CSS classes |
//! | `children` | `Children` | — | Content |

use yew::prelude::*;

/// Properties for the [`PageLink`] component.
///
/// | Prop | Type | Default | Description |
/// |------|------|---------|-------------|
/// | `href` | `Option<&'static str>` | `None` | Link URL |
/// | `classes` | `Classes` | — | Additional CSS classes |
/// | `children` | `Children` | — | Content |
#[derive(Properties, Clone, PartialEq, Debug)]
pub struct PageLinkProps {
    /// Additional CSS classes applied to the page link.
    #[prop_or_default]
    pub classes: Classes,

    /// Optional URL. When set, renders an `<a>` element; otherwise a `<span>`.
    #[prop_or_default]
    pub href: Option<&'static str>,

    /// Content rendered inside the page link.
    #[prop_or_default]
    pub children: Children
}

/// Link or span element within a pagination page item.
///
/// Renders an `<a>` when `href` is set, otherwise a `<span>`.
///
/// # CSS Classes
///
/// - `page-link` - Always applied
#[function_component]
pub fn PageLink(props: &PageLinkProps) -> Html {
    let mut classes = props.classes.clone();
    classes.push("page-link");

    if let Some(href) = props.href {
        html! {
            <a {href} {classes}>
                { for props.children.iter() }
            </a>
        }
    } else {
        html! {
            <span {classes}>
                { for props.children.iter() }
            </span>
        }
    }
}

#[cfg(test)]
mod tests {
    use super::*;

    #[test]
    fn page_link_with_href() {
        let props = PageLinkProps {
            classes:  Classes::default(),
            href:     Some("/page/2"),
            children: Children::new(vec![])
        };

        assert_eq!(props.href, Some("/page/2"));
    }

    #[test]
    fn page_link_without_href() {
        let props = PageLinkProps {
            classes:  Classes::default(),
            href:     None,
            children: Children::new(vec![])
        };

        assert!(props.href.is_none());
    }
}