var Component=(()=>{var h=Object.create;var r=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var F=(n,l)=>()=>(l||n((l={exports:{}}).exports,l),l.exports),C=(n,l)=>{for(var c in l)r(n,c,{get:l[c],enumerable:!0})},a=(n,l,c,o)=>{if(l&&typeof l=="object"||typeof l=="function")for(let s of E(l))!m.call(n,s)&&s!==c&&r(n,s,{get:()=>l[s],enumerable:!(o=p(l,s))||o.enumerable});return n};var k=(n,l,c)=>(c=n!=null?h(y(n)):{},a(l||!n||!n.__esModule?r(c,"default",{value:n,enumerable:!0}):c,n)),x=n=>a(r({},"__esModule",{value:!0}),n);var t=F((B,i)=>{i.exports=_jsx_runtime});var D={};C(D,{default:()=>g,frontmatter:()=>b});var e=k(t()),b={title:"Checkbox",description:"A control that toggles between two options, checked or unchecked.",peek:"checkbox-default"};function d(n){let l=Object.assign({div:"div",h2:"h2",pre:"pre",code:"code",span:"span"},n.components),{Preview:c}=l;return c||u("Preview",!0),(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(l.div,{className:"component-preview",children:[(0,e.jsx)(l.h2,{children:"Default"}),` `,(0,e.jsx)(c,{name:"checkbox-default",children:(0,e.jsxs)(l.div,{"data-rehype-pretty-code-fragment":"",children:[(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"light",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"light",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" { Checkbox } "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#032F62"},children:"'geist/components'"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" { useState, "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" JSX } "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#032F62"},children:"'react'"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"Component"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"JSX"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"Element"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" ["}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:", "}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"setChecked"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"] "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"useState"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"false"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"{checked} "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"onChange"}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"{()"}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"void"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"setChecked"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"(("}),(0,e.jsx)(l.span,{style:{color:"#E36209"},children:"b"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:") "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"!"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"b)}>"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" Option 1"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" );"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"}"})})]})}),(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"dark",__rawString__:`import { Checkbox } from 'geist/components'; import { useState, type JSX } from 'react'; export function Component(): JSX.Element { const [checked, setChecked] = useState(false); return ( setChecked((b) => !b)}> Option 1 ); } `,children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"dark",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { Checkbox } "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'geist/components'"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { useState, "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" JSX } "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'react'"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"Component"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"JSX"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"Element"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ["}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:", "}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"setChecked"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"] "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"useState"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"false"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{checked} "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"onChange"}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{()"}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"void"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"setChecked"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"(("}),(0,e.jsx)(l.span,{style:{color:"#FFAB70"},children:"b"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:") "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"!"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"b)}>"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" Option 1"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"}"})})]})})]})})]}),` `,(0,e.jsxs)(l.div,{className:"component-preview",children:[(0,e.jsx)(l.h2,{children:"Disabled"}),` `,(0,e.jsx)(c,{name:"checkbox-disabled",children:(0,e.jsxs)(l.div,{"data-rehype-pretty-code-fragment":"",children:[(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"light",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"light",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" { Checkbox, Stack } "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#032F62"},children:"'geist/components'"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" { JSX } "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#032F62"},children:"'react'"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"Component"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"JSX"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"Element"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"Stack"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"gap"}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"4"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"}>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:">Disabled"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" Disabled Checked"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"indeterminate"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" Disabled Indeterminate"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" );"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"}"})})]})}),(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"dark",__rawString__:`import { Checkbox, Stack } from 'geist/components'; import type { JSX } from 'react'; export function Component(): JSX.Element { return ( Disabled Disabled Checked Disabled Indeterminate ); } `,children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"dark",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { Checkbox, Stack } "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'geist/components'"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { JSX } "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'react'"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"Component"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"JSX"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"Element"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"Stack"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"gap"}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"4"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"}>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:">Disabled"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" Disabled Checked"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"indeterminate"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" Disabled Indeterminate"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"}"})})]})})]})})]}),` `,(0,e.jsxs)(l.div,{className:"component-preview",children:[(0,e.jsx)(l.h2,{children:"Indeterminate"}),` `,(0,e.jsx)(c,{name:"checkbox-indeterminate",children:(0,e.jsxs)(l.div,{"data-rehype-pretty-code-fragment":"",children:[(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"light",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"light",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" { Checkbox } "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#032F62"},children:"'geist/components'"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" { JSX } "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#032F62"},children:"'react'"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"Component"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"JSX"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"Element"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#D73A49"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#005CC5"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6F42C1"},children:"indeterminate"}),(0,e.jsx)(l.span,{style:{color:"#24292E"},children:">Option 1;"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#24292E"},children:"}"})})]})}),(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"dark",__rawString__:`import { Checkbox } from 'geist/components'; import type { JSX } from 'react'; export function Component(): JSX.Element { return Option 1; } `,children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"dark",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { Checkbox } "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'geist/components'"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { JSX } "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'react'"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"Component"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"JSX"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"Element"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F97583"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#79B8FF"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#B392F0"},children:"indeterminate"}),(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:">Option 1;"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E1E4E8"},children:"}"})})]})})]})})]})]})}function N(n={}){let{wrapper:l}=n.components||{};return l?(0,e.jsx)(l,Object.assign({},n,{children:(0,e.jsx)(d,n)})):d(n)}var g=N;function u(n,l){throw new Error("Expected "+(l?"component":"object")+" `"+n+"` to be defined: you likely forgot to import, pass, or provide it.")}return x(D);})(); ;return Component;