Badge

/** @jsxImportSource @bext-stack/framework */
// src/components/ui/badge.tsx
const VARIANT = {
  default: "border-transparent bg-primary text-primary-foreground shadow",
  secondary: "border-transparent bg-secondary text-secondary-foreground",
  destructive: "border-transparent bg-destructive text-destructive-foreground shadow",
  outline: "text-foreground",
};
export function Badge(o) {
  const c = ["inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold", VARIANT[o.variant || "default"], o.class].filter(Boolean).join(" ");
  return \`<span class="\${c}">\${o.children}</span>\`;
}