) } export { Badge, badgeVariants } `,__src__:"registry/default/ui/badge.tsx",__style__:"default",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" *"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" as"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" React "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "react"'})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" cva"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" type"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" VariantProps "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "class-variance-authority"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" cn "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/lib/utils"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"const"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" badgeVariants "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" cva"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"("})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variants"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" default"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "border-transparent bg-primary text-primary-foreground hover:bg-primary/80"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" secondary"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" destructive"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" outline"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "text-foreground"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" defaultVariants"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "default"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" }"})}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:")"})}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" interface"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeProps"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" extends"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" React"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"HTMLAttributes"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"<"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"HTMLDivElement"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">,"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" VariantProps"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {}"})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"({"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" ..."}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"props "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}:"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeProps"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:")"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"cn"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"badgeVariants"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"({"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}),"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:")}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {..."}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"props"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" badgeVariants "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]})]})})}),(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import * as React from "react" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "@/lib/utils" const badgeVariants = cva( "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", { variants: { variant: { default: "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80", secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80", destructive: "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80", outline: "text-foreground", }, }, defaultVariants: { variant: "default", }, } ) export interface BadgeProps extends React.HTMLAttributes, VariantProps {} function Badge({ className, variant, ...props }: BadgeProps) { return (

) } export { Badge, badgeVariants } `,__src__:"registry/new-york/ui/badge.tsx",__style__:"new-york",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" *"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" as"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" React "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "react"'})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" cva"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" type"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" VariantProps "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "class-variance-authority"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" cn "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/lib/utils"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"const"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" badgeVariants "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" cva"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"("})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variants"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" default"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" secondary"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" destructive"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" outline"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "text-foreground"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" defaultVariants"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "default"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" }"})}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:")"})}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" interface"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeProps"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" extends"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" React"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"HTMLAttributes"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"<"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"HTMLDivElement"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">,"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" VariantProps"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {}"})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"({"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" ..."}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"props "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}:"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeProps"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:")"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"cn"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"badgeVariants"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"({"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}),"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:")}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {..."}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"props"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" badgeVariants "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]})]})})})]}),(0,n.jsx)(i,{children:"Update the import paths to match your project setup."})]})})]}),` `,(0,n.jsxs)(e.h2,{id:"usage",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#usage",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Usage"]}),` `,(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" `,children:(0,n.jsx)(e.code,{"data-language":"tsx","data-theme":"default",children:(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]})})})}),` `,(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`Badge `,children:(0,n.jsx)(e.code,{"data-language":"tsx","data-theme":"default",children:(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"<"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:'"outline"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]})})})}),` `,(0,n.jsxs)(e.h3,{id:"link",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#link",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Link"]}),` `,(0,n.jsxs)(e.p,{children:["You can use the ",(0,n.jsx)(e.code,{children:"badgeVariants"})," helper to create a link that looks like a badge."]}),` `,(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { badgeVariants } from "@/components/ui/badge" `,children:(0,n.jsx)(e.code,{"data-language":"tsx","data-theme":"default",children:(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" badgeVariants "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]})})})}),` `,(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`Badge `,children:(0,n.jsx)(e.code,{"data-language":"tsx","data-theme":"default",children:(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"<"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Link className"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"badgeVariants"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"({"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "outline"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" })}>"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]})})})}),` `,(0,n.jsxs)(e.h2,{id:"examples",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#examples",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Examples"]}),` `,(0,n.jsxs)(e.h3,{id:"default",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#default",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Default"]}),` `,(0,n.jsxs)(r,{name:"badge-demo",description:"A badge",children:[(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" export function BadgeDemo() { return Badge } `,__src__:"registry/default/example/badge-demo.tsx",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeDemo"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" export function BadgeDemo() { return Badge } `,__src__:"registry/new-york/example/badge-demo.tsx",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeDemo"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,n.jsx)(e.hr,{}),` `,(0,n.jsxs)(e.h3,{id:"secondary",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#secondary",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Secondary"]}),` `,(0,n.jsxs)(r,{name:"badge-secondary",description:"A badge using secondary as variant.",children:[(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" export function BadgeSecondary() { return Secondary } `,__src__:"registry/default/example/badge-secondary.tsx",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeSecondary"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:'"secondary"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Secondary"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" export function BadgeSecondary() { return Secondary } `,__src__:"registry/new-york/example/badge-secondary.tsx",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeSecondary"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:'"secondary"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Secondary"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,n.jsx)(e.hr,{}),` `,(0,n.jsxs)(e.h3,{id:"outline",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#outline",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Outline"]}),` `,(0,n.jsxs)(r,{name:"badge-outline",description:"A badge using outline as variant.",children:[(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" export function BadgeOutline() { return Outline } `,__src__:"registry/default/example/badge-outline.tsx",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeOutline"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:'"outline"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Outline"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" export function BadgeOutline() { return Outline } `,__src__:"registry/new-york/example/badge-outline.tsx",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeOutline"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:'"outline"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Outline"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,n.jsx)(e.hr,{}),` `,(0,n.jsxs)(e.h3,{id:"destructive",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#destructive",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Destructive"]}),` `,(0,n.jsxs)(r,{name:"badge-destructive",description:"A destructive badge.",children:[(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" export function BadgeDestructive() { return Destructive } `,__src__:"registry/default/example/badge-destructive.tsx",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeDestructive"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:'"destructive"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Destructive"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,n.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,n.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Badge } from "@/components/ui/badge" export function BadgeDestructive() { return Destructive } `,__src__:"registry/new-york/example/badge-destructive.tsx",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:" Badge "}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/badge"'})]}),` `,(0,n.jsx)(e.span,{className:"line",children:" "}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,n.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" BadgeDestructive"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,n.jsxs)(e.span,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Badge variant"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:'"destructive"'}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,n.jsx)(e.span,{style:{color:"#FFF"},children:"Destructive"}),(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,n.jsx)(e.span,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]})]})}function k(l={}){let{wrapper:e}=l.components||{};return e?(0,n.jsx)(e,Object.assign({},l,{children:(0,n.jsx)(m,l)})):m(l)}var w=k;function s(l,e){throw new Error("Expected "+(e?"component":"object")+" `"+l+"` to be defined: you likely forgot to import, pass, or provide it.")}return V(D);})(); ;return Component;

Badge

Installation

Usage

Link

Examples

Default

Secondary

Outline

Destructive