dioxus_element_plug/components/
anchor.rs

1use dioxus::prelude::*;
2
3/// Anchor props
4#[derive(Props, Clone, PartialEq)]
5pub struct AnchorProps {
6    #[props(default)]
7    pub children: Element,
8
9    /// Current active anchor
10    #[props(default)]
11    pub current: Option<String>,
12
13    /// Anchor direction
14    #[props(default = "vertical".to_string())]
15    pub direction: String,
16
17    /// Container selector
18    #[props(default)]
19    pub container: Option<String>,
20
21    /// Offset for triggering active state
22    #[props(default = 100)]
23    pub offset: u32,
24
25    /// Scroll offset
26    #[props(default = 0)]
27    pub scroll_offset: u32,
28
29    /// Bound element selector
30    #[props(default)]
31    pub bound: Option<u32>,
32
33    #[props(default)]
34    pub on_click: Option<EventHandler<String>>,
35
36    #[props(default)]
37    pub class: Option<String>,
38
39    #[props(default)]
40    pub style: Option<String>,
41}
42
43/// Anchor component for anchor navigation
44#[component]
45pub fn Anchor(props: AnchorProps) -> Element {
46    let mut class_names = vec!["el-anchor".to_string()];
47    class_names.push(format!("el-anchor--{}", props.direction));
48    if let Some(ref c) = props.class { class_names.push(c.clone()); }
49
50    rsx! {
51        div {
52            class: "{class_names.join(\" \")}",
53            style: props.style.clone().unwrap_or_default(),
54            div {
55                class: "el-anchor__wrapper",
56                {props.children}
57            }
58        }
59    }
60}
61
62/// AnchorLink props
63#[derive(Props, Clone, PartialEq)]
64pub struct AnchorLinkProps {
65    /// Link text
66    pub title: String,
67
68    /// Anchor href
69    pub href: String,
70
71    #[props(default)]
72    pub children: Option<Element>,
73
74    #[props(default = false)]
75    pub disabled: bool,
76
77    #[props(default)]
78    pub on_click: Option<EventHandler<String>>,
79
80    #[props(default)]
81    pub class: Option<String>,
82}
83
84/// AnchorLink component for individual anchor links
85#[component]
86pub fn AnchorLink(props: AnchorLinkProps) -> Element {
87    let href_clone = props.href.clone();
88    rsx! {
89        div {
90            class: "el-anchor__link {props.class.clone().unwrap_or_default()}",
91            a {
92                class: "el-anchor__link-title",
93                href: "{props.href}",
94                onclick: move |e| {
95                    e.prevent_default();
96                    if !props.disabled {
97                        if let Some(handler) = props.on_click {
98                            handler.call(href_clone.clone());
99                        }
100                    }
101                },
102                "{props.title}"
103            }
104            {props.children}
105        }
106    }
107}
dioxus_element_plug/components/anchor.rs

dioxus_element_plug/components/
anchor.rs
