use yew::prelude::*;
pub fn intl_slug(key: &str) -> String {
key.chars()
.map(|x| {
if x.is_ascii_alphanumeric() {
x.to_ascii_lowercase()
} else {
'-'
}
})
.collect()
}
fn humanize(key: &str) -> String {
let mut out = String::with_capacity(key.len());
for x in key.chars() {
if x.is_alphanumeric() {
if out.is_empty() {
out.extend(x.to_uppercase());
} else {
out.push(x);
}
} else if matches!(x, '_' | '-') || x.is_whitespace() {
out.push(' ');
}
}
out
}
pub fn intl_content_style(var: &str, fallback: &str) -> String {
format!("--psp-label--content: var(--psp-label--{var}--content, \"{fallback}\")")
}
#[derive(Properties, PartialEq)]
pub struct IntlLabelProps {
pub name: String,
#[prop_or_default]
pub group: bool,
#[prop_or_default]
pub class: Classes,
}
#[function_component(IntlLabel)]
pub fn intl_label(props: &IntlLabelProps) -> Html {
let slug = intl_slug(&props.name);
let (id, var) = if props.group {
(
format!("{}-group-label", props.name),
format!("group-{slug}"),
)
} else {
(format!("{}-label", props.name), slug)
};
let style = intl_content_style(&var, &humanize(&props.name));
let class = classes!("intl-label", props.class.clone());
html! { <label {class} {id} {style} /> }
}