var Component=(()=>{var B=Object.create;var d=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var m=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var C=(l,e)=>()=>(e||l((e={exports:{}}).exports,e),e.exports),F=(l,e)=>{for(var a in e)d(l,a,{get:e[a],enumerable:!0})},h=(l,e,a,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of D(e))!u.call(l,r)&&r!==a&&d(l,r,{get:()=>e[r],enumerable:!(s=A(e,r))||s.enumerable});return l};var x=(l,e,a)=>(a=l!=null?B(m(l)):{},h(e||!l||!l.__esModule?d(a,"default",{value:l,enumerable:!0}):a,l)),b=l=>h(d({},"__esModule",{value:!0}),l);var y=C((I,p)=>{p.exports=_jsx_runtime});var N={};F(N,{default:()=>_,frontmatter:()=>f});var n=x(y()),f={title:"Badge",description:"Badges are used to highlight important information.",component:!0,type:"Doc",package:{name:"ui",path:"badge.tsx"}};function g(l){let e=Object.assign({figure:"figure",pre:"pre",code:"code",span:"span",h2:"h2",a:"a",h3:"h3"},l.components),{ComponentExample:a,BadgeDemo:s,BadgeSecondary:r,BadgeDanger:o,BadgeOutline:i,BadgeSuccess:t}=e;return o||c("BadgeDanger",!0),s||c("BadgeDemo",!0),i||c("BadgeOutline",!0),r||c("BadgeSecondary",!0),t||c("BadgeSuccess",!0),a||c("ComponentExample",!0),(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(a,{src:"/src/components/examples/badge/demo.tsx",children:[(0,n.jsx)(s,{}),(0,n.jsx)(e.figure,{__src__:"/src/components/examples/badge/demo.tsx","data-rehype-pretty-code-figure":"",children:(0,n.jsx)(e.pre,{style:{backgroundColor:"#22272e"},tabIndex:"0","data-language":"tsx","data-theme":"github-dark-dimmed",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-dimmed",style:{display:"grid"},children:[(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'use client'"})}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" { Badge } "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'@nerdfish/ui'"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"function"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#DCBDFB"},children:"BadgeDemo"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"() {"})]}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"return"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#8DDB8C"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:">badge"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"}"})})]})})})]}),` `,(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.figure,{"data-rehype-pretty-code-figure":"",children:(0,n.jsx)(e.pre,{style:{backgroundColor:"#22272e"},tabIndex:"0","data-language":"tsx","data-theme":"github-dark-dimmed",children:(0,n.jsx)(e.code,{"data-language":"tsx","data-theme":"github-dark-dimmed",style:{display:"grid"},children:(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" { Badge } "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'@nerdfish/ui'"})]})})})}),` `,(0,n.jsx)(e.figure,{"data-rehype-pretty-code-figure":"",children:(0,n.jsx)(e.pre,{style:{backgroundColor:"#22272e"},tabIndex:"0","data-language":"tsx","data-theme":"github-dark-dimmed",children:(0,n.jsx)(e.code,{"data-language":"tsx","data-theme":"github-dark-dimmed",style:{display:"grid"},children:(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"<"}),(0,n.jsx)(e.span,{style:{color:"#8DDB8C"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:">Badge"})]})})})}),` `,(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)(a,{src:"/src/components/examples/badge/demo.tsx",children:[(0,n.jsx)(s,{}),(0,n.jsx)(e.figure,{__src__:"/src/components/examples/badge/demo.tsx","data-rehype-pretty-code-figure":"",children:(0,n.jsx)(e.pre,{style:{backgroundColor:"#22272e"},tabIndex:"0","data-language":"tsx","data-theme":"github-dark-dimmed",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-dimmed",style:{display:"grid"},children:[(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'use client'"})}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" { Badge } "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'@nerdfish/ui'"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"function"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#DCBDFB"},children:"BadgeDemo"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"() {"})]}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"return"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#8DDB8C"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:">badge"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"}"})})]})})})]}),` `,(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)(a,{src:"/src/components/examples/badge/secondary.tsx",children:[(0,n.jsx)(r,{}),(0,n.jsx)(e.figure,{__src__:"/src/components/examples/badge/secondary.tsx","data-rehype-pretty-code-figure":"",children:(0,n.jsx)(e.pre,{style:{backgroundColor:"#22272e"},tabIndex:"0","data-language":"tsx","data-theme":"github-dark-dimmed",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-dimmed",style:{display:"grid"},children:[(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'use client'"})}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" { Badge } "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'@nerdfish/ui'"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"function"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#DCBDFB"},children:"BadgeSecondary"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"() {"})]}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"return"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#8DDB8C"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#6CB6FF"},children:"variant"}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:'"secondary"'}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:">badge"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"}"})})]})})})]}),` `,(0,n.jsxs)(e.h3,{id:"danger",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#danger",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Danger"]}),` `,(0,n.jsxs)(a,{src:"/src/components/examples/badge/danger.tsx",children:[(0,n.jsx)(o,{}),(0,n.jsx)(e.figure,{__src__:"/src/components/examples/badge/danger.tsx","data-rehype-pretty-code-figure":"",children:(0,n.jsx)(e.pre,{style:{backgroundColor:"#22272e"},tabIndex:"0","data-language":"tsx","data-theme":"github-dark-dimmed",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-dimmed",style:{display:"grid"},children:[(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'use client'"})}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" { Badge } "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'@nerdfish/ui'"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"function"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#DCBDFB"},children:"BadgeDanger"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"() {"})]}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"return"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#8DDB8C"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#6CB6FF"},children:"variant"}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:'"danger"'}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:">badge"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"}"})})]})})})]}),` `,(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)(a,{src:"/src/components/examples/badge/outline.tsx",children:[(0,n.jsx)(i,{}),(0,n.jsx)(e.figure,{__src__:"/src/components/examples/badge/outline.tsx","data-rehype-pretty-code-figure":"",children:(0,n.jsx)(e.pre,{style:{backgroundColor:"#22272e"},tabIndex:"0","data-language":"tsx","data-theme":"github-dark-dimmed",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-dimmed",style:{display:"grid"},children:[(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'use client'"})}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" { Badge } "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'@nerdfish/ui'"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"function"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#DCBDFB"},children:"BadgeOutline"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"() {"})]}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"return"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#8DDB8C"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#6CB6FF"},children:"variant"}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:'"outline"'}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:">badge"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"}"})})]})})})]}),` `,(0,n.jsxs)(e.h3,{id:"success",children:[(0,n.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#success",children:(0,n.jsx)(e.span,{className:"icon icon-link"})}),"Success"]}),` `,(0,n.jsxs)(a,{src:"/src/components/examples/badge/success.tsx",children:[(0,n.jsx)(t,{}),(0,n.jsx)(e.figure,{__src__:"/src/components/examples/badge/success.tsx","data-rehype-pretty-code-figure":"",children:(0,n.jsx)(e.pre,{style:{backgroundColor:"#22272e"},tabIndex:"0","data-language":"tsx","data-theme":"github-dark-dimmed",children:(0,n.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-dimmed",style:{display:"grid"},children:[(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'use client'"})}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"import"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" { Badge } "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"from"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:"'@nerdfish/ui'"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"export"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"function"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#DCBDFB"},children:"BadgeSuccess"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"() {"})]}),` `,(0,n.jsxs)(e.span,{"data-line":"",children:[(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"return"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" <"}),(0,n.jsx)(e.span,{style:{color:"#8DDB8C"},children:"Badge"}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#6CB6FF"},children:"variant"}),(0,n.jsx)(e.span,{style:{color:"#F47067"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#96D0FF"},children:'"success"'}),(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:">badge"})]}),` `,(0,n.jsx)(e.span,{"data-line":"",children:(0,n.jsx)(e.span,{style:{color:"#ADBAC7"},children:"}"})})]})})})]})]})}function k(l={}){let{wrapper:e}=l.components||{};return e?(0,n.jsx)(e,Object.assign({},l,{children:(0,n.jsx)(g,l)})):g(l)}var _=k;function c(l,e){throw new Error("Expected "+(e?"component":"object")+" `"+l+"` to be defined: you likely forgot to import, pass, or provide it.")}return b(N);})(); ;return Component;