Skip to main content

impulse_thaw/tag/
interaction_tag.rs

1use super::{TagGroupInjection, TagSize};
2use leptos::prelude::*;
3use thaw_utils::{class_list, mount_style};
4
5#[component]
6pub fn InteractionTag(
7    #[prop(optional, into)] class: MaybeProp<String>,
8    /// Size of the tag.
9    #[prop(optional, into)]
10    size: Option<Signal<TagSize>>,
11    children: Children,
12) -> impl IntoView {
13    mount_style("interaction-tag", include_str!("./interaction-tag.css"));
14    let tag_group = TagGroupInjection::use_context();
15    let size_class = {
16        if let Some(size) = size {
17            Some(size)
18        } else if let Some(tag_group) = tag_group {
19            Some(tag_group.size)
20        } else {
21            None
22        }
23    };
24
25    view! {
26        <div class=class_list![
27            "thaw-interaction-tag",
28                size_class.map(|size| move || format!("thaw-interaction-tag--{}", size.get().as_str())),
29                class
30        ]>{children()}</div>
31    }
32}
33
34#[component]
35pub fn InteractionTagPrimary(
36    #[prop(optional, into)] class: MaybeProp<String>,
37    children: Children,
38) -> impl IntoView {
39    view! {
40        <button class=class_list!["thaw-interaction-tag-primary", class]>
41            <span class="thaw-interaction-tag-primary__primary-text">{children()}</span>
42        </button>
43    }
44}