var Component=(()=>{var m=Object.create;var a=Object.defineProperty;var C=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var T=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var G=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),A=(n,e)=>{for(var r in e)a(n,r,{get:e[r],enumerable:!0})},h=(n,e,r,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of B(e))!I.call(n,o)&&o!==r&&a(n,o,{get:()=>e[o],enumerable:!(s=C(e,o))||s.enumerable});return n};var f=(n,e,r)=>(r=n!=null?m(T(n)):{},h(e||!n||!n.__esModule?a(r,"default",{value:n,enumerable:!0}):r,n)),b=n=>h(a({},"__esModule",{value:!0}),n);var g=G((_,y)=>{y.exports=_jsx_runtime});var x={};A(x,{default:()=>D});var l=f(g());function u(n){let e={a:"a",code:"code",figure:"figure",h2:"h2",h3:"h3",pre:"pre",span:"span",...n.components},{ComponentPreview:r,ComponentSource:s,Step:o,Steps:t,Tabs:d,TabsContent:F,TabsList:p,TabsTrigger:i}=e;return r||c("ComponentPreview",!0),s||c("ComponentSource",!0),o||c("Step",!0),t||c("Steps",!0),d||c("Tabs",!0),F||c("TabsContent",!0),p||c("TabsList",!0),i||c("TabsTrigger",!0),(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)(r,{name:"toggle-group-demo",description:"A toggle group with three items.",children:[(0,l.jsx)(e.figure,{__src__:"registry/default/example/toggle-group-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { Bold, Italic, Underline } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "lucide-react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Bold"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Italic"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"underline"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle underline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Underline"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/austin/example/toggle-group-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/dc/example/toggle-group-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h2,{id:"installation",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#installation",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Installation"]}),` `,(0,l.jsxs)(d,{defaultValue:"cli",children:[(0,l.jsxs)(p,{children:[(0,l.jsx)(i,{value:"cli",children:"CLI"}),(0,l.jsx)(i,{value:"manual",children:"Manual"})]}),(0,l.jsx)(F,{value:"cli",children:(0,l.jsx)(e.figure,{"data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"bash","data-theme":"github-dark-high-contrast",children:(0,l.jsx)(e.code,{"data-language":"bash","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"bunx"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" --bun"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:" @uplusion23/forge-ui"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:" add"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:" toggle-group"})]})})})})}),(0,l.jsx)(F,{value:"manual",children:(0,l.jsxs)(t,{children:[(0,l.jsx)(o,{children:"Install the following dependencies:"}),(0,l.jsx)(e.figure,{"data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"bash","data-theme":"github-dark-high-contrast",children:(0,l.jsx)(e.code,{"data-language":"bash","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"npm"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:" install"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:" @radix-ui/react-toggle-group"})]})})})}),(0,l.jsx)(o,{children:"Copy and paste the following code into your project."}),(0,l.jsxs)(s,{name:"toggle-group",children:[(0,l.jsx)(e.figure,{__src__:"registry/default/ui/toggle-group.tsx",__style__:"default","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"use client"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { cn, VariantProps } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/lib/utils"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { toggleVariants } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroupContext"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React."}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"createContext"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"typeof"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" toggleVariants>>({"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size: "}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"default"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant: "}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"default"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"});"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" &"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"className"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"variant"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"size"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"..."}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:") "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"=>"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupPrimitive.Root"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"flex items-center justify-center gap-1"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", className)"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" >"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupContext.Provider"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"{ variant, size }"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"{"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"));"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ToggleGroup.displayName "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive.Root.displayName;"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" &"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"className"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"variant"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"size"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"..."}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:") "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"=>"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" context"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React."}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"useContext"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(ToggleGroupContext);"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupPrimitive.Item"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" toggleVariants"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"({"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant: context.variant "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"||"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant,"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size: context.size "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"||"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size,"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }),"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" className,"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" )"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" >"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"});"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ToggleGroupItem.displayName "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive.Item.displayName;"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem };"})]})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/austin/ui/toggle-group.tsx",__style__:"austin","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"use client"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { cn, VariantProps } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/lib/utils"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { toggleVariants } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroupContext"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React."}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"createContext"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"typeof"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" toggleVariants>>({"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size: "}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"default"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant: "}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"default"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"});"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" &"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"className"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"variant"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"size"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"..."}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:") "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"=>"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupPrimitive.Root"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"flex items-center justify-center gap-1"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", className)"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" >"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupContext.Provider"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"{ variant, size }"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"{"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"));"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ToggleGroup.displayName "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive.Root.displayName;"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" &"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"className"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"variant"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"size"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"..."}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:") "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"=>"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" context"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React."}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"useContext"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(ToggleGroupContext);"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupPrimitive.Item"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" toggleVariants"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"({"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant: context.variant "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"||"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant,"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size: context.size "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"||"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size,"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }),"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" className,"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" )"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" >"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"});"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ToggleGroupItem.displayName "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive.Item.displayName;"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem };"})]})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/dc/ui/toggle-group.tsx",__style__:"dc","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"use client"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { cn, VariantProps } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/lib/utils"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { toggleVariants } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroupContext"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React."}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"createContext"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"typeof"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" toggleVariants>>({"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size: "}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"default"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant: "}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"default"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"});"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" &"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"className"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"variant"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"size"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"..."}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:") "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"=>"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupPrimitive.Root"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"flex items-center justify-center gap-1"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", className)"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" >"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupContext.Provider"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"{ variant, size }"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"{"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"));"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ToggleGroup.displayName "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive.Root.displayName;"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.forwardRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"<"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ElementRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:","})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React.ComponentPropsWithoutRef"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" &"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:""})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(({ "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"className"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"variant"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"size"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:", "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"..."}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }, "}),(0,l.jsx)(e.span,{style:{color:"#FFB757"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:") "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"=>"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" const"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" context"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" ="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" React."}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"useContext"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"(ToggleGroupContext);"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupPrimitive.Item"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" toggleVariants"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"({"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant: context.variant "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"||"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" variant,"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size: context.size "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"||"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" size,"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" }),"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" className,"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" )"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" >"})}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"children"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"});"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"ToggleGroupItem.displayName "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ToggleGroupPrimitive.Item.displayName;"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem };"})]})]})})})]}),(0,l.jsx)(o,{children:"Update the import paths to match your project setup."})]})})]}),` `,(0,l.jsxs)(e.h2,{id:"usage",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#usage",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Usage"]}),` `,(0,l.jsx)(e.figure,{"data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsx)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'})]})})})}),` `,(0,l.jsx)(e.figure,{"data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"single"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"a"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">A"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"b"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">B"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"c"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">C"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:""})]})]})})}),` `,(0,l.jsxs)(e.h2,{id:"examples",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#examples",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Examples"]}),` `,(0,l.jsxs)(e.h3,{id:"default",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#default",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Default"]}),` `,(0,l.jsxs)(r,{name:"toggle-group-demo",description:"A toggle group with three items.",children:[(0,l.jsx)(e.figure,{__src__:"registry/default/example/toggle-group-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { Bold, Italic, Underline } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "lucide-react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Bold"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Italic"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"underline"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle underline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Underline"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/austin/example/toggle-group-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/dc/example/toggle-group-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"outline",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#outline",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Outline"]}),` `,(0,l.jsxs)(r,{name:"toggle-group-outline",description:"A toggle group using the outline variant.",children:[(0,l.jsx)(e.figure,{__src__:"registry/default/example/toggle-group-outline.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { Bold, Italic, Underline } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "lucide-react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"outline"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Bold"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Italic"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"underline"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle underline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Underline"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/austin/example/toggle-group-outline.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"outline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/dc/example/toggle-group-outline.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"outline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"single",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#single",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Single"]}),` `,(0,l.jsxs)(r,{name:"toggle-group-single",description:"A toggle group with single selection.",children:[(0,l.jsx)(e.figure,{__src__:"registry/default/example/toggle-group-single.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { Bold, Italic, Underline } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "lucide-react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"single"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Bold"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Italic"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"underline"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle underline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Underline"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/austin/example/toggle-group-single.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"single"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/dc/example/toggle-group-single.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"single"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"small",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#small",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Small"]}),` `,(0,l.jsxs)(r,{name:"toggle-group-sm",description:"A toggle group using the small size.",children:[(0,l.jsx)(e.figure,{__src__:"registry/default/example/toggle-group-sm.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { Bold, Italic, Underline } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "lucide-react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"sm"'}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Bold"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Italic"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"underline"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle underline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Underline"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/austin/example/toggle-group-sm.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"single"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"sm"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/dc/example/toggle-group-sm.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"single"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"sm"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"large",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#large",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Large"]}),` `,(0,l.jsxs)(r,{name:"toggle-group-lg",description:"A toggle group using the large size.",children:[(0,l.jsx)(e.figure,{__src__:"registry/default/example/toggle-group-lg.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { Bold, Italic, Underline } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "lucide-react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"lg"'}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Bold"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Italic"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"underline"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle underline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Underline"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/austin/example/toggle-group-lg.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"lg"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/dc/example/toggle-group-lg.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"lg"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"disabled",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#disabled",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"Disabled"]}),` `,(0,l.jsxs)(r,{name:"toggle-group-disabled",description:"A disabled toggle group.",children:[(0,l.jsx)(e.figure,{__src__:"registry/default/example/toggle-group-disabled.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { Bold, Italic, Underline } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "lucide-react"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" disabled"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"single"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Bold"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Italic"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"underline"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle underline"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"Underline"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/austin/example/toggle-group-disabled.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" disabled"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})}),(0,l.jsx)(e.figure,{__src__:"registry/dc/example/toggle-group-disabled.tsx","data-rehype-pretty-code-figure":"",children:(0,l.jsx)(e.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark-high-contrast",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"github-dark-high-contrast",style:{display:"grid"},children:[(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { FontBoldIcon, FontItalicIcon, UnderlineIcon } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@radix-ui/react-icons"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" { ToggleGroup, ToggleGroupItem } "}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:' "@/components/ui/toggle-group"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:";"})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:" "}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#DBB7FF"},children:" ToggleGroupDemo"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"() {"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroup"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"multiple"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" disabled"}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"bold"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontBoldIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"italic"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"FontItalicIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"ToggleGroupItem"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" value"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"Toggle strikethrough"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:">"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#72F088"},children:"UnderlineIcon"}),(0,l.jsx)(e.span,{style:{color:"#91CBFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FF9492"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#ADDCFF"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsxs)(e.span,{"data-line":"",children:[(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" "})]}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:" );"})}),` `,(0,l.jsx)(e.span,{"data-line":"",children:(0,l.jsx)(e.span,{style:{color:"#F0F3F6"},children:"}"})})]})})})]})]})}function D(n={}){let{wrapper:e}=n.components||{};return e?(0,l.jsx)(e,{...n,children:(0,l.jsx)(u,{...n})}):u(n)}function c(n,e){throw new Error("Expected "+(e?"component":"object")+" `"+n+"` to be defined: you likely forgot to import, pass, or provide it.")}return b(x);})(); ;return Component;

Toggle Group

Installation

Usage

Examples

Default

Outline

Single

Small

Large

Disabled