{"name":"badge","type":"registry:ui","files":[{"path":"badge.tsx","type":"registry:ui","content":"import { mergeProps } from \"@base-ui-components/react/merge-props\"\nimport { useRender } from \"@base-ui-components/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst badgeVariants = cva(\n  \"relative inline-flex shrink-0 items-center justify-center gap-[var(--hui-space-2)] whitespace-nowrap rounded-[var(--hui-radius-1)] border-0 px-[var(--hui-space-2)] py-[var(--hui-space-1)] [font-style:normal] [font-weight:var(--hui-font-weight-regular)] outline-none focus-visible:[outline:var(--hui-focus-ring)] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:text-[var(--hui-color-foreground-base-primary)] [button,a&]:cursor-pointer [button,a&]:pointer-coarse:after:absolute [button,a&]:pointer-coarse:after:size-full [button,a&]:pointer-coarse:after:min-h-11 [button,a&]:pointer-coarse:after:min-w-11\",\n  {\n    variants: {\n      variant: {\n        default:\n          \"bg-[var(--hui-color-background-accent-primary)] text-[var(--hui-color-foreground-base-primary)]\",\n        destructive:\n          \"bg-[var(--hui-color-background-danger-primary)] text-[var(--hui-color-foreground-base-primary)]\",\n        outline:\n          \"border-[0.5px] border-[var(--hui-color-border-base-primary)] bg-transparent text-[var(--hui-color-foreground-base-primary)]\",\n        secondary:\n          \"bg-[var(--hui-color-background-neutral-secondary)] text-[var(--hui-color-foreground-base-primary)]\",\n        info: \"bg-[var(--hui-color-background-accent-primary)] text-[var(--hui-color-foreground-base-primary)]\",\n        success:\n          \"bg-[var(--hui-color-background-success-primary)] text-[var(--hui-color-foreground-base-primary)]\",\n        warning:\n          \"bg-[var(--hui-color-background-attention-primary)] text-[var(--hui-color-foreground-base-primary)]\",\n        error:\n          \"bg-[var(--hui-color-background-danger-primary)] text-[var(--hui-color-foreground-base-primary)]\",\n        neutral:\n          \"bg-[var(--hui-color-background-neutral-secondary)] text-[var(--hui-color-foreground-base-primary)]\",\n        accent:\n          \"bg-[var(--hui-color-background-accent-primary)] text-[var(--hui-color-foreground-base-primary)]\",\n        danger:\n          \"bg-[var(--hui-color-background-danger-primary)] text-[var(--hui-color-foreground-base-primary)]\",\n        gradient:\n          \"bg-[linear-gradient(to_right,oklch(0.5674_0.2831_312.58_/_0.2)_0%,oklch(0.5988_0.2445_29.12_/_0.2)_100%)] text-[var(--hui-color-foreground-base-primary)]\",\n      },\n      size: {\n        default:\n          \"h-[22px] [font-size:var(--hui-font-size-small)] [letter-spacing:var(--hui-letter-spacing-small)] [line-height:var(--hui-line-height-small)] [&_svg:not([class*='size-'])]:size-[var(--hui-space-4)]\",\n        sm: \"h-[18px] [font-size:var(--hui-font-size-micro)] [letter-spacing:var(--hui-letter-spacing-micro)] [line-height:var(--hui-line-height-micro)] [&_svg:not([class*='size-'])]:size-[10px]\",\n        lg: \"h-[var(--hui-space-8)] [font-size:var(--hui-font-size-regular)] [letter-spacing:var(--hui-letter-spacing-regular)] [line-height:var(--hui-line-height-regular)] [&_svg:not([class*='size-'])]:size-[14px]\",\n        micro:\n          \"h-[18px] [font-size:var(--hui-font-size-micro)] [letter-spacing:var(--hui-letter-spacing-micro)] [line-height:var(--hui-line-height-micro)] [&_svg:not([class*='size-'])]:size-[10px]\",\n        small:\n          \"h-[22px] [font-size:var(--hui-font-size-small)] [letter-spacing:var(--hui-letter-spacing-small)] [line-height:var(--hui-line-height-small)] [&_svg:not([class*='size-'])]:size-[var(--hui-space-4)]\",\n        regular:\n          \"h-[var(--hui-space-8)] [font-size:var(--hui-font-size-regular)] [letter-spacing:var(--hui-letter-spacing-regular)] [line-height:var(--hui-line-height-regular)] [&_svg:not([class*='size-'])]:size-[14px]\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\ninterface BadgeProps extends useRender.ComponentProps<\"span\"> {\n  variant?: VariantProps<typeof badgeVariants>[\"variant\"]\n  size?: VariantProps<typeof badgeVariants>[\"size\"]\n}\n\nfunction Badge({ className, variant, size, render, ...props }: BadgeProps) {\n  const defaultProps = {\n    \"data-slot\": \"badge\",\n    className: cn(badgeVariants({ variant, size, className })),\n  }\n\n  return useRender({\n    defaultTagName: \"span\",\n    render,\n    props: mergeProps<\"span\">(defaultProps, props),\n  })\n}\n\nexport { Badge, badgeVariants }\n","target":"components/ui/badge.tsx"}],"dependencies":["@base-ui-components/react","class-variance-authority"]}