Accept terms and conditions

) } `,__src__:"registry/ax-base/example/checkbox-demo.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxDemo"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import { Checkbox } from '@brudi/react-checkbox' export function CheckboxDemo() { return (

Accept terms and conditions

) } `,__src__:"registry/ax-site/example/checkbox-demo.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxDemo"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import { Checkbox } from '@brudi/react-checkbox' export function CheckboxDemo() { return (

Accept terms and conditions

) } `,__src__:"registry/ax-app/example/checkbox-demo.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxDemo"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},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.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"bash","data-theme":"default",__rawString__:`npm install @brudi/react-checkbox `,__npmCommand__:`npm install @brudi/react-checkbox `,__yarnCommand__:`yarn add @brudi/react-checkbox `,__pnpmCommand__:`pnpm add @brudi/react-checkbox `,children:(0,e.jsx)(l.code,{"data-language":"bash","data-theme":"default",children:(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"npm"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"install"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"@brudi/react-checkbox"})]})})})}),` `,(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.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Checkbox } from "@brudi/react-checkbox" `,children:(0,e.jsx)(l.code,{"data-language":"tsx","data-theme":"default",children:(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"@brudi/react-checkbox"'})]})})})}),` `,(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:` `,children:(0,e.jsx)(l.code,{"data-language":"tsx","data-theme":"default",children:(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]})})})}),` `,(0,e.jsxs)(l.h2,{id:"examples",children:[(0,e.jsx)(l.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#examples",children:(0,e.jsx)(l.span,{className:"icon icon-link"})}),"Examples"]}),` `,(0,e.jsxs)(l.h3,{id:"with-text",children:[(0,e.jsx)(l.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#with-text",children:(0,e.jsx)(l.span,{className:"icon icon-link"})}),"With text"]}),` `,(0,e.jsxs)(s,{name:"checkbox-with-text",children:[(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import { Checkbox } from '@brudi/react-checkbox' export function CheckboxWithText() { return (

Accept terms and conditions

You agree to our Terms of Service and Privacy Policy.

) } `,__src__:"registry/ax-base/example/checkbox-with-text.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxWithText"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"items-top flex space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms1"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"grid gap-1.5 leading-none"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms1"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"p"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm text-muted-foreground"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" You agree to our Terms of Service and Privacy Policy."})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import { Checkbox } from '@brudi/react-checkbox' export function CheckboxWithText() { return (

Accept terms and conditions

You agree to our Terms of Service and Privacy Policy.

) } `,__src__:"registry/ax-site/example/checkbox-with-text.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxWithText"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"items-top flex space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms1"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"grid gap-1.5 leading-none"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms1"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"p"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm text-muted-foreground"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" You agree to our Terms of Service and Privacy Policy."})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import { Checkbox } from '@brudi/react-checkbox' export function CheckboxWithText() { return (

Accept terms and conditions

You agree to our Terms of Service and Privacy Policy.

) } `,__src__:"registry/ax-app/example/checkbox-with-text.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxWithText"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"items-top flex space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms1"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"grid gap-1.5 leading-none"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms1"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"p"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm text-muted-foreground"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" You agree to our Terms of Service and Privacy Policy."})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})})]}),` `,(0,e.jsxs)(l.h3,{id:"disabled",children:[(0,e.jsx)(l.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#disabled",children:(0,e.jsx)(l.span,{className:"icon icon-link"})}),"Disabled"]}),` `,(0,e.jsxs)(s,{name:"checkbox-disabled",children:[(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Checkbox } from '@brudi/react-checkbox' export function CheckboxDisabled() { return (

Accept terms and conditions

) } `,__src__:"registry/ax-base/example/checkbox-disabled.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxDisabled"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms2"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms2"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Checkbox } from '@brudi/react-checkbox' export function CheckboxDisabled() { return (

Accept terms and conditions

) } `,__src__:"registry/ax-site/example/checkbox-disabled.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxDisabled"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms2"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms2"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Checkbox } from '@brudi/react-checkbox' export function CheckboxDisabled() { return (

Accept terms and conditions

) } `,__src__:"registry/ax-app/example/checkbox-disabled.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxDisabled"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex items-center space-x-2"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms2"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"disabled"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"label"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"htmlFor"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"terms2"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Accept terms and conditions"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})})]}),` `,(0,e.jsxs)(l.h3,{id:"form",children:[(0,e.jsx)(l.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#form",children:(0,e.jsx)(l.span,{className:"icon icon-link"})}),"Form"]}),` `,(0,e.jsxs)(s,{name:"checkbox-form-single",children:[(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import { useForm } from '@brudi/react-form' import Link from 'next/link' import * as z from 'zod' import { Button } from '@brudi/react-button' import { Checkbox } from '@brudi/react-checkbox' import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel } from '@brudi/react-form' import { toast } from '@brudi/react-toast' const FormSchema = z.object({ mobile: z.boolean().default(false).optional() }) export function CheckboxReactHookFormSingle() { const form = useForm({ schema: FormSchema, defaultValues: { mobile: true } }) function onSubmit(data: z.infer) { toast('You submitted the following values:', { description: (

          {JSON.stringify(data, null, 2)}

) }) } return (

(

Use different settings for my mobile devices You can manage your mobile notifications in the{' '} mobile settings page.

)} /> ) } `,__src__:"registry/ax-base/example/checkbox-form-single.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"useForm"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-form'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Link"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'next/link'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'zod'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Button"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-button'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Form"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormControl"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormDescription"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormField"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormItem"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormLabel"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-form'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"toast"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-toast'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"object"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" mobile"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"boolean"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"default"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"false"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"optional"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"()"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxReactHookFormSingle"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"useForm"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" schema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" defaultValues"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" mobile"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"true"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"data"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"infer"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"typeof"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:">)"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"toast"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'You submitted the following values:'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"description"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"pre"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"mt-2 w-[340px] rounded-md bg-slate-950 p-4"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"code"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-white"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"JSON"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"stringify"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"data"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"null"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"2"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"handleSubmit"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"space-y-6"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormField"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"name"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"mobile"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"render"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{({"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"})"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormItem"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex flex-row items-start space-x-3 space-y-0 rounded-md border p-4 shadow"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormControl"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"onCheckedChange"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"onChange"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"space-y-1 leading-none"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormLabel"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"Use different settings for my mobile devices"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormDescription"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" You can manage your mobile notifications in the"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"' '"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Link"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"href"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"/examples/forms"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"mobile settings"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" page."})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Button"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"submit"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"Submit"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import Link from 'next/link' import { zodResolver } from '@hookform/resolvers/zod' import { useForm } from '@brudi/react-form' import * as z from 'zod' import { Button } from '@brudi/react-button' import { Checkbox } from '@brudi/react-checkbox' import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel } from '@brudi/react-form' import { toast } from '@brudi/react-toast' const FormSchema = z.object({ mobile: z.boolean().default(false).optional() }) export function CheckboxReactHookFormSingle() { const form = useForm({ schema: FormSchema, defaultValues: { mobile: true } }) function onSubmit(data: z.infer) { toast('You submitted the following values:', { description: (

          {JSON.stringify(data, null, 2)}

) }) } return (

(

Use different settings for my mobile devices You can manage your mobile notifications in the{' '} mobile settings page.

)} /> ) } `,__src__:"registry/ax-site/example/checkbox-form-single.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Link"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'next/link'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"zodResolver"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@hookform/resolvers/zod'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"useForm"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-form'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'zod'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Button"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-button'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Form"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormControl"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormDescription"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormField"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormItem"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormLabel"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-form'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"toast"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-toast'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"object"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" mobile"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"boolean"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"default"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"false"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"optional"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"()"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxReactHookFormSingle"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"useForm"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" schema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" defaultValues"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" mobile"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"true"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"data"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"infer"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"typeof"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:">)"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"toast"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'You submitted the following values:'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"description"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"pre"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"mt-2 w-[340px] rounded-md bg-slate-950 p-4"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"code"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-white"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"JSON"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"stringify"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"data"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"null"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"2"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"handleSubmit"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"space-y-6"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormField"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"name"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"mobile"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"render"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{({"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"})"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormItem"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex flex-row items-start space-x-3 space-y-0 rounded-md border p-4"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormControl"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"onCheckedChange"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"onChange"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"space-y-1 leading-none"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormLabel"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"Use different settings for my mobile devices"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormDescription"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" You can manage your mobile notifications in the"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"' '"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Link"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"href"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"/examples/forms"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"mobile settings"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" page."})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Button"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"submit"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"Submit"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import Link from 'next/link' import { zodResolver } from '@hookform/resolvers/zod' import { useForm } from '@brudi/react-form' import * as z from 'zod' import { Button } from '@brudi/react-button' import { Checkbox } from '@brudi/react-checkbox' import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel } from '@brudi/react-form' import { toast } from '@brudi/react-toast' const FormSchema = z.object({ mobile: z.boolean().default(false).optional() }) export function CheckboxReactHookFormSingle() { const form = useForm({ schema: FormSchema, defaultValues: { mobile: true } }) function onSubmit(data: z.infer) { toast('You submitted the following values:', { description: (

          {JSON.stringify(data, null, 2)}

) }) } return (

(

Use different settings for my mobile devices You can manage your mobile notifications in the{' '} mobile settings page.

)} /> ) } `,__src__:"registry/ax-app/example/checkbox-form-single.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Link"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'next/link'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"zodResolver"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@hookform/resolvers/zod'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"useForm"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-form'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'zod'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Button"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-button'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Form"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormControl"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormDescription"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormField"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormItem"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormLabel"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-form'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"toast"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-toast'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"object"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" mobile"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"boolean"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"default"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"false"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"optional"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"()"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxReactHookFormSingle"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"useForm"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" schema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" defaultValues"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" mobile"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"true"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"data"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"infer"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"typeof"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:">)"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"toast"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'You submitted the following values:'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"description"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"pre"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"mt-2 w-[340px] rounded-md bg-slate-950 p-4"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"code"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-white"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"JSON"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"stringify"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"data"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"null"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"2"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"handleSubmit"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"space-y-6"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormField"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"name"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"mobile"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"render"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{({"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"})"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormItem"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex flex-row items-start space-x-3 space-y-0 rounded-md border p-4 shadow"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormControl"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"onCheckedChange"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"onChange"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"space-y-1 leading-none"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormLabel"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"Use different settings for my mobile devices"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormDescription"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" You can manage your mobile notifications in the"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"' '"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Link"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"href"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"/examples/forms"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"mobile settings"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" page."})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Button"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"submit"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"Submit"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})})]}),` `,(0,e.jsxs)(s,{name:"checkbox-form-multiple",children:[(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import { zodResolver } from '@hookform/resolvers/zod' import { useForm } from '@brudi/react-form' import * as z from 'zod' import { Button } from '@brudi/react-button' import { Checkbox } from '@brudi/react-checkbox' import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from '@brudi/react-form' import { toast } from '@brudi/react-toast' const items = [ { id: 'recents', label: 'Recents' }, { id: 'home', label: 'Home' }, { id: 'applications', label: 'Applications' }, { id: 'desktop', label: 'Desktop' }, { id: 'downloads', label: 'Downloads' }, { id: 'documents', label: 'Documents' } ] as const const FormSchema = z.object({ items: z.array(z.string()).refine((value) => value.some((item) => item), { message: 'You have to select at least one item.' }) }) export function CheckboxReactHookFormMultiple() { const form = useForm({ schema: FormSchema, defaultValues: { items: ['recents', 'home'] } }) function onSubmit(data: z.infer) { toast('You submitted the following values:', { description: (

          {JSON.stringify(data, null, 2)}

) }) } return (

(

Sidebar Select the items you want to display in the sidebar.

          {JSON.stringify(data, null, 2)}

) }) } return (

(

Sidebar Select the items you want to display in the sidebar.

          {JSON.stringify(data, null, 2)}

) }) } return (

(

Sidebar Select the items you want to display in the sidebar.

{items.map((item) => ( { return ( { return checked ? field.onChange([...field.value, item.id]) : field.onChange(field.value?.filter((value) => value !== item.id)) }} /> {item.label} ) }} /> ))} )} /> ) } `,__src__:"registry/ax-app/example/checkbox-form-multiple.tsx",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"zodResolver"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@hookform/resolvers/zod'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"useForm"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-form'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'zod'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Button"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-button'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Form"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormControl"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormDescription"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormField"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormItem"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormLabel"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormMessage"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-form'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"toast"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-toast'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"items"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ["})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'recents'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" label"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'Recents'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"},"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'dashboard'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" label"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'Dashboard'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"},"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'applications'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" label"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'Applications'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"},"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'things'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" label"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'IoT Things'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"},"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'releases'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" label"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'Releases'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"},"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" id"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'notes'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" label"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'Notes'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"] "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"as"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"object"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" items"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"array"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"string"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"())"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"refine"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"some"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" message"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'You have to select at least one item.'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"CheckboxReactHookFormMultiple"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"useForm"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" schema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" defaultValues"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" items"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ["}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'recents'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'home'"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"]"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"function"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"data"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"z"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"infer"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"typeof"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"FormSchema"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:">)"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"toast"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'You submitted the following values:'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"description"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"pre"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"mt-2 w-[340px] rounded-md bg-slate-950 p-4"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"code"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-white"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"JSON"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"stringify"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"data"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"null"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"2"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"handleSubmit"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"onSubmit"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"space-y-8"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormField"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"name"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"items"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"render"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{()"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormItem"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"div"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"mb-4"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormLabel"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-base"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"Sidebar"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormDescription"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" Select the items you want to display in the sidebar."})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"items"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"map"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormField"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"key"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"form"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"control"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"name"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"items"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"render"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{({"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"})"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormItem"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"key"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"flex flex-row items-start space-x-3 space-y-0"'})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormControl"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Checkbox"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"?."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"includes"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"onCheckedChange"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"checked"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"return"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"checked"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"?"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"onChange"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"(["}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"])"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:":"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"onChange"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"field"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"?."}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"filter"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"value"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"!=="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"id"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"))"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormLabel"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"text-sm font-normal"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"item"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"label"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ))"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"FormMessage"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Button"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"type"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"submit"'}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"Submit"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" )"})}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})})]})})})]}),` `,(0,e.jsxs)(l.h2,{id:"customization",children:[(0,e.jsx)(l.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#customization",children:(0,e.jsx)(l.span,{className:"icon icon-link"})}),"Customization"]}),` `,(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"bash","data-theme":"default",__rawString__:`npx @brudi/ui extend checkbox `,__npmCommand__:`npx @brudi/ui extend checkbox `,__yarnCommand__:`npx @brudi/ui extend checkbox `,__pnpmCommand__:`pnpx @brudi/ui extend checkbox `,children:(0,e.jsx)(l.code,{"data-language":"bash","data-theme":"default",children:(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"npx"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"@brudi/ui"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"extend"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"checkbox"})]})})})}),` `,(0,e.jsx)(r,{type:"single",collapsible:!0,children:(0,e.jsxs)(c,{value:"manual-installation",children:[(0,e.jsx)(t,{children:"Manual Customization"}),(0,e.jsx)(d,{children:(0,e.jsxs)(p,{children:[(0,e.jsx)(a,{children:"Install the following dependencies:"}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"bash","data-theme":"default",__rawString__:`npm install @brudi/react-checkbox `,__npmCommand__:`npm install @brudi/react-checkbox `,__yarnCommand__:`yarn add @brudi/react-checkbox `,__pnpmCommand__:`pnpm add @brudi/react-checkbox `,children:(0,e.jsx)(l.code,{"data-language":"bash","data-theme":"default",children:(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"npm"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"install"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"@brudi/react-checkbox"})]})})})}),(0,e.jsx)(a,{children:"Copy and paste the following code into your project."}),(0,e.jsxs)(h,{name:"checkbox",children:[(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import * as CheckboxPrimitive from '@brudi/react-checkbox' import * as React from 'react' const Checkbox = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef >(({ children, ...props }, ref) => ( {children} )) Checkbox.displayName = CheckboxPrimitive.Root.displayName const CheckboxIndicator = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef >(({ children, ...props }, ref) => ( {children} )) CheckboxIndicator.displayName = CheckboxPrimitive.Root.displayName export { Checkbox } `,__src__:"registry/ax-base/ui/checkbox.tsx",__style__:"ax-base",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxPrimitive"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'react'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"forwardRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"<"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ElementRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:""}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ComponentPropsWithoutRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"({"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"children"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"},"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"CheckboxPrimitive.Root"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"CheckboxPrimitive.Indicator"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"children"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"))"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"displayName"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxPrimitive"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Root"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"displayName"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxIndicator"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"forwardRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"<"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ElementRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:""}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ComponentPropsWithoutRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"({"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"children"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"},"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"CheckboxPrimitive.Indicator"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"children"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"))"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxIndicator"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"displayName"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxPrimitive"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Root"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"displayName"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import * as React from 'react' import * as CheckboxPrimitive from '@brudi/react-checkbox' import { Check } from 'lucide-react' import { ax } from '@brudi/react-utils' const Checkbox = React.forwardRef< React.ElementRef, Omit, 'children'> >(({ className, ...props }, ref) => ( )) Checkbox.displayName = CheckboxPrimitive.Root.displayName export { Checkbox } `,__src__:"registry/ax-site/ui/checkbox.tsx",__style__:"ax-site",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'react'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxPrimitive"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Check"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'lucide-react'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ax"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-utils'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"forwardRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"<"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ElementRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:""}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Omit"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ComponentPropsWithoutRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:""}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'children'"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"({"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"},"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"CheckboxPrimitive.Root"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"ax"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'w-5 h-5'"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"CheckboxPrimitive.Indicator"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Check"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"h-5 w-5"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"))"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"displayName"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxPrimitive"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Root"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"displayName"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]})]})})}),(0,e.jsx)(l.div,{"data-rehype-pretty-code-fragment":"",children:(0,e.jsx)(l.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`'use client' import * as React from 'react' import * as CheckboxPrimitive from '@brudi/react-checkbox' import { Check } from 'lucide-react' import { ax } from '@brudi/react-utils' const Checkbox = React.forwardRef< React.ElementRef, Omit, 'children'> >((props, ref) => ( )) Checkbox.displayName = CheckboxPrimitive.Root.displayName export { Checkbox } `,__src__:"registry/ax-app/ui/checkbox.tsx",__style__:"ax-app",children:(0,e.jsxs)(l.code,{"data-language":"tsx","data-theme":"default",children:[(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'use client'"})}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'react'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#EA9A97"},children:"*"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" as "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxPrimitive"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-checkbox'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Check"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'lucide-react'"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"import "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ax"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" from "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'@brudi/react-utils'"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"const"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"forwardRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"<"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ElementRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:""}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Omit"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"React"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ComponentPropsWithoutRef"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:""}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:"'children'"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:">"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"("}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:","}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:")"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"=>"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" ("})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"CheckboxPrimitive.Root"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"ref"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"..."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"props"}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"CheckboxPrimitive.Indicator"}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:">"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"<"}),(0,e.jsx)(l.span,{style:{color:"#9CCFD8"},children:"Check"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#C4A7E7",fontStyle:"italic"},children:"className"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#F6C177"},children:'"h-4 w-4"'}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:"/>"})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#6E6A86"},children:""})]}),` `,(0,e.jsx)(l.span,{className:"line",children:(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:"))"})}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"displayName"}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"="}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"CheckboxPrimitive"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Root"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"."}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"displayName"})]}),` `,(0,e.jsx)(l.span,{className:"line",children:" "}),` `,(0,e.jsxs)(l.span,{className:"line",children:[(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:"export "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"{"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#E0DEF4",fontStyle:"italic"},children:"Checkbox"}),(0,e.jsx)(l.span,{style:{color:"#3E8FB0"},children:" "}),(0,e.jsx)(l.span,{style:{color:"#908CAA"},children:"}"})]})]})})})]}),(0,e.jsx)(a,{children:"Update the import paths to match your project setup."})]})})]})})]})}function k(n={}){let{wrapper:l}=n.components||{};return l?(0,e.jsx)(l,Object.assign({},n,{children:(0,e.jsx)(m,n)})):m(n)}var g=k;function o(n,l){throw new Error("Expected "+(l?"component":"object")+" `"+n+"` to be defined: you likely forgot to import, pass, or provide it.")}return S(v);})(); ;return Component;