feedsignal/crates/web/src/components/tooltip/component.rs
Austin Schaefer 6a2bf8c9a8 Add feed sidebar navigation, built from Dioxus's component library
Default view stays the all-feeds joined article list, now with a sidebar
listing every subscribed feed so a reader can pin down to one feed's
articles. Filtering happens server-side (list_ranked_articles now takes
an optional feed_id).

Pulled in the sidebar/badge/scroll_area (plus their sheet/skeleton/
tooltip/separator dependencies) components via `dx components add`
instead of hand-rolling nav/tag/scroll markup, matching this project's
existing pattern of using the Dioxus component library over raw
elements (see button/input).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PqTJmazHBQK878vjQ4JnnF
2026-09-03 16:28:22 +02:00

61 lines
1.6 KiB
Rust

use dioxus::prelude::*;
use dioxus_primitives::dioxus_attributes::attributes;
use dioxus_primitives::merge_attributes;
use dioxus_primitives::tooltip::{self, TooltipContentProps, TooltipProps, TooltipTriggerProps};
#[css_module("/src/components/tooltip/style.css")]
struct Styles;
#[component]
pub fn Tooltip(props: TooltipProps) -> Element {
let base = attributes!(div {
class: Styles::dx_tooltip,
});
let merged = merge_attributes(vec![base, props.attributes]);
rsx! {
tooltip::Tooltip {
disabled: props.disabled,
open: props.open,
default_open: props.default_open,
on_open_change: props.on_open_change,
attributes: merged,
{props.children}
}
}
}
#[component]
pub fn TooltipTrigger(props: TooltipTriggerProps) -> Element {
let base = attributes!(button {
class: Styles::dx_tooltip_trigger,
});
let merged = merge_attributes(vec![base, props.attributes]);
rsx! {
tooltip::TooltipTrigger {
id: props.id,
as: props.r#as,
attributes: merged,
{props.children}
}
}
}
#[component]
pub fn TooltipContent(props: TooltipContentProps) -> Element {
let base = attributes!(div {
class: Styles::dx_tooltip_content,
});
let merged = merge_attributes(vec![base, props.attributes]);
rsx! {
tooltip::TooltipContent {
id: props.id,
side: props.side,
align: props.align,
attributes: merged,
{props.children}
}
}
}