BasecoatUI components for htmy.

Badge

Example:

Default Destructive Secondary Outline Ghost

Code example:

from htmy import ComponentType, html

from htmui.basecoat.badge import badge


def example() -> ComponentType:
    return html.div(
        badge("Default"),
        badge("Destructive", variant="destructive"),
        badge("Secondary", variant="secondary"),
        badge("Outline", variant="outline"),
        badge("Ghost", variant="ghost"),
        class_="flex gap-2",
    )

Component implementation:

For more details, see the BasecoatUI documentation.

from __future__ import annotations

from typing import TYPE_CHECKING, Literal

from htmy import html
from htmy.utils import join

if TYPE_CHECKING:
    from htmy import ComponentType, PropertyValue


__version__ = "0.2.0"
__framework__ = "BasecoatUI"
__framework_version__ = "1"
__framework_url__ = "https://basecoatui.com/components/badge/"

BadgeVariant = Literal["secondary", "destructive", "outline", "ghost"]


def badge(
    *children: ComponentType,
    variant: BadgeVariant | None = None,
    class_: str | None = None,
    **kwargs: PropertyValue,
) -> ComponentType:
    if variant is not None:
        kwargs["data_variant"] = variant
    return html.span(
        *children,
        class_=join("badge", class_),
        **kwargs,
    )