Accept terms and conditions

); } `,"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{style:{backgroundColor:"#282A36",color:"#f6f6f4"},tabIndex:"0","data-language":"tsx","data-theme":"dracula-soft",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"dracula-soft",style:{display:"grid"},children:[(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" { Checkbox } "}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"@/components/retroui/Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" { Text } "}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"@/components/retroui/Text"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:" default"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:" function"}),(0,e.jsx)(l.span,{style:{color:"#62E884"},children:" CheckboxStyleDefault"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"() {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:" return"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#62E884",fontStyle:"italic"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"flex gap-2 items-center"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:">"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" />"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:"Text"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:">Accept terms and conditions"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" "})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" );"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"}"})})]})})})}),` `,(0,e.jsx)("br",{}),` `,(0,e.jsx)("br",{}),` `,(0,e.jsx)(l.h2,{id:"installation",children:"Installation"}),` `,(0,e.jsxs)(c,{children:[(0,e.jsx)(c.Cli,{children:(0,e.jsx)(l.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{style:{backgroundColor:"#282A36",color:"#f6f6f4"},tabIndex:"0","data-language":"sh","data-theme":"dracula-soft",children:(0,e.jsx)(l.code,{"data-language":"sh","data-theme":"dracula-soft",style:{display:"grid"},children:(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#62E884"},children:"npx"}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:" shadcn@latest"}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:" add"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"https://retroui.dev/r/checkbox.json"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'})]})})})})}),(0,e.jsxs)(c.Manual,{children:[(0,e.jsx)(l.h4,{id:"1-install-dependencies",children:"1. Install dependencies:"}),(0,e.jsx)(l.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{style:{backgroundColor:"#282A36",color:"#f6f6f4"},tabIndex:"0","data-language":"sh","data-theme":"dracula-soft",children:(0,e.jsx)(l.code,{"data-language":"sh","data-theme":"dracula-soft",style:{display:"grid"},children:(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#62E884"},children:"npm"}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:" install"}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:" @radix-ui/react-checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:" class-variance-authority"}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:" lucide-react"})]})})})}),(0,e.jsx)("br",{}),(0,e.jsx)(l.h4,{id:"2-copy-the-code--into-your-project",children:"2. Copy the code \u{1F447} into your project:"}),(0,e.jsx)(o,{name:"checkbox",children:(0,e.jsx)(l.figure,{__src__:"/retroui/components/retroui/Checkbox.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(l.pre,{style:{backgroundColor:"#282A36",color:"#f6f6f4"},tabIndex:"0","data-language":"tsx","data-theme":"dracula-soft",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"dracula-soft",style:{display:"grid"},children:[(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" { cn } "}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"@/lib/utils"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#BF9EEE"},children:" *"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:" as"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" CheckboxPrimitive "}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"@radix-ui/react-checkbox"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" { cva, VariantProps } "}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"class-variance-authority"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:";"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"import"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" { Check } "}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"from"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"lucide-react"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:";"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" checkboxVariants "}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#62E884"},children:" cva"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"border-black border-2"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:", {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" variants"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" variant"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" default"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"data-[state=checked]:bg-primary"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:","})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" outline"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' ""'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:","})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" solid"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"data-[state=checked]:bg-black *:text-white"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:","})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" },"})}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" size"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" sm"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"h-4 w-4"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:","})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" md"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"h-5 w-5"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:","})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" lg"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"h-6 w-6"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:","})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" },"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" },"})}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" defaultVariants"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" {"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" variant"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"default"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:","})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" size"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:' "'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"md"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:","})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" },"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"});"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"interface"}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:" CheckboxProps"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:" extends"}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:" React"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:"ComponentProps"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"typeof"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" CheckboxPrimitive.Root>,"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:" VariantProps"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"typeof"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" checkboxVariants> {}"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:" const"}),(0,e.jsx)(l.span,{style:{color:"#62E884"},children:" Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:" ="}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" ({"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" className,"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" size,"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" variant,"})}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:" ..."}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"props"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:" CheckboxProps"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:") "}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:"CheckboxPrimitive.Root"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#62E884",fontStyle:"italic"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#62E884"},children:"cn"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"("})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#62E884"},children:" checkboxVariants"}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"({"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" size,"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" variant,"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" }),"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" className,"})}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" )}"})}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" {"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:"props}"})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" >"})}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:"CheckboxPrimitive.Indicator"}),(0,e.jsx)(l.span,{style:{color:"#62E884",fontStyle:"italic"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"h-full w-full"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:">"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" <"}),(0,e.jsx)(l.span,{style:{color:"#97E1F1",fontStyle:"italic"},children:"Check"}),(0,e.jsx)(l.span,{style:{color:"#62E884",fontStyle:"italic"},children:" className"}),(0,e.jsx)(l.span,{style:{color:"#F286C4"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#E7EE98"},children:"h-full w-full"}),(0,e.jsx)(l.span,{style:{color:"#DEE492"},children:'"'}),(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" />"})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" "})]}),` `,(0,e.jsxs)(l.span,{"data-line":"",children:[(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:" "})]}),` `,(0,e.jsx)(l.span,{"data-line":"",children:(0,e.jsx)(l.span,{style:{color:"#F6F6F4"},children:");"})})]})})})})]})]}),` `,(0,e.jsx)("br",{}),` `,(0,e.jsx)("br",{}),` `,(0,e.jsx)(l.h2,{id:"examples",children:"Examples"}),` `,(0,e.jsx)(l.h3,{id:"variants",children:"Variants"}),` `,(0,e.jsx)(r,{name:"checkbox-style-variants",children:(0,e.jsx)(l.figure,{__src__:"preview/components/checkbox-style-variants.tsx",__rawString__:`import { Checkbox } from "@/components/retroui/Checkbox"; export default function CheckboxStyleVariants() { return (

Checkbox

Installation

Examples

Variants

Sizes