var Component=(()=>{var b=Object.create;var o=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var C=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var B=(n,l)=>()=>(l||n((l={exports:{}}).exports,l),l.exports),L=(n,l)=>{for(var r in l)o(n,r,{get:l[r],enumerable:!0})},p=(n,l,r,c)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of D(l))!x.call(n,a)&&a!==r&&o(n,a,{get:()=>l[a],enumerable:!(c=f(l,a))||c.enumerable});return n};var _=(n,l,r)=>(r=n!=null?b(C(n)):{},p(l||!n||!n.__esModule?o(r,"default",{value:n,enumerable:!0}):r,n)),A=n=>p(o({},"__esModule",{value:!0}),n);var m=B((R,y)=>{y.exports=_jsx_runtime});var v={};L(v,{default:()=>g});var e=_(m());function u(n){let l={a:"a",code:"code",figure:"figure",h2:"h2",pre:"pre",span:"span",...n.components},{ComponentPreview:r,ComponentSource:c,Step:a,Steps:i,Tabs:d,TabsContent:t,TabsList:h,TabsTrigger:F}=l;return r||s("ComponentPreview",!0),c||s("ComponentSource",!0),a||s("Step",!0),i||s("Steps",!0),d||s("Tabs",!0),t||s("TabsContent",!0),h||s("TabsList",!0),F||s("TabsTrigger",!0),(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(r,{name:"label-demo",description:"A label",children:[(0,e.jsx)(l.figure,{__src__:"registry/default/example/label-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Checkbox } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/checkbox"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Label } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/label"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" function"}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:" LabelDemo"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" return"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"Label"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">Accept terms and conditions"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,e.jsx)(l.figure,{__src__:"registry/austin/example/label-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Checkbox } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/checkbox"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Label } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/label"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" function"}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:" LabelDemo"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" return"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"Label"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">Accept terms and conditions"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,e.jsx)(l.figure,{__src__:"registry/dc/example/label-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Checkbox } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/checkbox"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Label } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/label"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" function"}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:" LabelDemo"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" return"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"Label"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">Accept terms and conditions"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"}"})})]})})})]}),` `,(0,e.jsxs)(l.h2,{id:"installation",children:[(0,e.jsx)(l.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#installation",children:(0,e.jsx)(l.span,{className:"icon icon-link"})}),"Installation"]}),` `,(0,e.jsxs)(d,{defaultValue:"cli",children:[(0,e.jsxs)(h,{children:[(0,e.jsx)(F,{value:"cli",children:"CLI"}),(0,e.jsx)(F,{value:"manual",children:"Manual"})]}),(0,e.jsx)(t,{value:"cli",children:(0,e.jsx)(l.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"bash","data-theme":"github-dark-high-contrast",children:(0,e.jsx)(l.code,{"data-language":"bash","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"bunx"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" --bun"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:" @uplusion23/forge-ui"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:" add"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:" label"})]})})})})}),(0,e.jsx)(t,{value:"manual",children:(0,e.jsxs)(i,{children:[(0,e.jsx)(a,{children:"Install the following dependencies:"}),(0,e.jsx)(l.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"bash","data-theme":"github-dark-high-contrast",children:(0,e.jsx)(l.code,{"data-language":"bash","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"npm"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:" install"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:" @radix-ui/react-label"})]})})})}),(0,e.jsx)(a,{children:"Copy and paste the following code into your project."}),(0,e.jsxs)(c,{name:"label",children:[(0,e.jsx)(l.figure,{__src__:"registry/default/ui/label.tsx",__style__:"default","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"use client"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" *"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" as"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "react"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" *"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" as"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" LabelPrimitive "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-label"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { cn, cva, "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" VariantProps } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/lib/utils"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" labelVariants"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" ="}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:" cva"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:");"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" Label"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" ="}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" &"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:", "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:") "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"LabelPrimitive.Root"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" ref"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"={"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"={"}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:"labelVariants"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"(), className)"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" {..."}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"));"})}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"Label.displayName "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" LabelPrimitive.Root.displayName;"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Label };"})]})]})})}),(0,e.jsx)(l.figure,{__src__:"registry/austin/ui/label.tsx",__style__:"austin","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"use client"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" *"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" as"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "react"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" *"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" as"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" LabelPrimitive "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-label"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { cn, cva, "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" VariantProps } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/lib/utils"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" labelVariants"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" ="}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:" cva"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:");"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" Label"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" ="}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" &"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:", "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:") "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"LabelPrimitive.Root"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" ref"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"={"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"={"}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:"labelVariants"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"(), className)"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" {..."}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"));"})}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"Label.displayName "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" LabelPrimitive.Root.displayName;"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Label };"})]})]})})}),(0,e.jsx)(l.figure,{__src__:"registry/dc/ui/label.tsx",__style__:"dc","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"use client"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" *"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" as"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "react"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" *"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" as"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" LabelPrimitive "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-label"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { cn, cva, "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" VariantProps } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/lib/utils"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" labelVariants"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" ="}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:" cva"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:");"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" Label"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" ="}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" &"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:", "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,e.jsx)(l.span,{style:{color:"#FFB757"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:") "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"LabelPrimitive.Root"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" ref"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"={"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"={"}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#DBB7FF"},children:"labelVariants"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"(), className)"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:" {..."}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"));"})}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"Label.displayName "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" LabelPrimitive.Root.displayName;"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Label };"})]})]})})})]}),(0,e.jsx)(a,{children:"Update the import paths to match your project setup."})]})})]}),` `,(0,e.jsxs)(l.h2,{id:"usage",children:[(0,e.jsx)(l.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#usage",children:(0,e.jsx)(l.span,{className:"icon icon-link"})}),"Usage"]}),` `,(0,e.jsx)(l.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,e.jsx)(l.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:" { Label } "}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/label"'})]})})})}),` `,(0,e.jsx)(l.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,e.jsx)(l.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#72F088"},children:"Label"}),(0,e.jsx)(l.span,{style:{color:"#91CBFF"},children:" htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#FF9492"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#ADDCFF"},children:'"email"'}),(0,e.jsx)(l.span,{style:{color:"#F0F3F6"},children:">Your email address"})]})})})})]})}function g(n={}){let{wrapper:l}=n.components||{};return l?(0,e.jsx)(l,{...n,children:(0,e.jsx)(u,{...n})}):u(n)}function s(n,l){throw new Error("Expected "+(l?"component":"object")+" `"+n+"` to be defined: you likely forgot to import, pass, or provide it.")}return A(v);})(); ;return Component;