Skip to main content

freya_components/icons/
arrow.rs

1use dioxus::prelude::*;
2use freya_elements as dioxus_elements;
3use freya_hooks::{
4    use_applied_theme,
5    IconTheme,
6    IconThemeWith,
7};
8
9/// Properties for the [`ArrowIcon`] component.
10#[derive(Props, Clone, PartialEq)]
11pub struct ArrowIconProps {
12    /// Theme override.
13    pub theme: Option<IconThemeWith>,
14    /// Rotation degree.
15    #[props(into)]
16    pub rotate: String,
17    /// Color.
18    #[props(into)]
19    pub fill: String,
20}
21
22/// Icon component for an Arrow.
23#[allow(non_snake_case)]
24pub fn ArrowIcon(
25    ArrowIconProps {
26        theme,
27        rotate,
28        fill,
29    }: ArrowIconProps,
30) -> Element {
31    let IconTheme {
32        height,
33        width,
34        margin,
35    } = use_applied_theme!(&theme, icon);
36
37    rsx!(svg {
38        height: "{height}",
39        width: "{width}",
40        margin: "{margin}",
41        rotate: "{rotate}deg",
42        svg_content: r#"
43            <svg viewBox="0 0 18 12" fill="none" xmlns="http://www.w3.org/2000/svg">
44            <path fill-rule="evenodd" clip-rule="evenodd" d="M7.18177 9.58579L0 2.40401L1.81823 0.585785L9 7.76756L16.1818 0.585787L18 2.40402L10.8182 9.58579L10.8185 9.58601L9.00023 11.4042L9 11.404L8.99977 11.4042L7.18154 9.58602L7.18177 9.58579Z" fill="{fill}" stroke="{fill}" stroke-width="2"/>
45            </svg>
46        "#
47    })
48}