var Component=(()=>{var u=Object.create;var F=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var T=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var x=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),b=(n,e)=>{for(var s in e)F(n,s,{get:e[s],enumerable:!0})},h=(n,e,s,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of N(e))!_.call(n,r)&&r!==s&&F(n,r,{get:()=>e[r],enumerable:!(o=f(e,r))||o.enumerable});return n};var v=(n,e,s)=>(s=n!=null?u(T(n)):{},h(e||!n||!n.__esModule?F(s,"default",{value:n,enumerable:!0}):s,n)),w=n=>h(F({},"__esModule",{value:!0}),n);var g=x((V,y)=>{y.exports=_jsx_runtime});var k={};b(k,{default:()=>P,frontmatter:()=>I});var l=v(g()),I={title:"\u5207\u6362\u6309\u94AE",description:"\u4E00\u4E2A\u53EF\u4EE5\u5F00\u542F\u6216\u5173\u95ED\u7684\u4E8C\u6001\u6309\u94AE\u3002",component:!0,links:{doc:"https://www.radix-ui.com/docs/primitives/components/toggle",api:"https://www.radix-ui.com/docs/primitives/components/toggle#api-reference"}};function m(n){let e=Object.assign({div:"div",pre:"pre",code:"code",span:"span",h2:"h2",a:"a",h3:"h3"},n.components),{ComponentPreview:s,Tabs:o,TabsList:r,TabsTrigger:i,TabsContent:t,Steps:d,Step:a,ComponentSource:p}=e;return s||c("ComponentPreview",!0),p||c("ComponentSource",!0),a||c("Step",!0),d||c("Steps",!0),o||c("Tabs",!0),t||c("TabsContent",!0),r||c("TabsList",!0),i||c("TabsTrigger",!0),(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)(s,{name:"toggle-demo",description:"\u4E00\u4E2A\u5207\u6362\u6309\u94AE\u7EC4\u4EF6\u3002",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Bold } from "lucide-react" import { Toggle } from "@/components/ui/toggle" export function ToggleDemo() { return ( ) } `,__src__:"registry/default/example/toggle-demo.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Bold "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "lucide-react"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleDemo"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Bold className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { FontBoldIcon } from "@radix-ui/react-icons" import { Toggle } from "@/components/ui/toggle" export function ToggleDemo() { return ( ) } `,__src__:"registry/new-york/example/toggle-demo.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" FontBoldIcon "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-icons"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleDemo"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"FontBoldIcon className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h2,{id:"\u5B89\u88C5",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u5B89\u88C5",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u5B89\u88C5"]}),` `,(0,l.jsxs)(o,{defaultValue:"cli",children:[(0,l.jsxs)(r,{children:[(0,l.jsx)(i,{value:"cli",children:"CLI"}),(0,l.jsx)(i,{value:"manual",children:"\u624B\u52A8"})]}),(0,l.jsx)(t,{value:"cli",children:(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"bash","data-theme":"default",__rawString__:`npx shadcn-ui@latest add toggle `,__npmCommand__:`npx shadcn-ui@latest add toggle `,__yarnCommand__:`npx shadcn-ui@latest add toggle `,__pnpmCommand__:`pnpm dlx shadcn-ui@latest add toggle `,__bunCommand__:`bunx --bun shadcn-ui@latest add toggle `,children:(0,l.jsx)(e.code,{"data-language":"bash","data-theme":"default",children:(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"npx"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" shadcn-ui@latest"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" add"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" toggle"})]})})})})}),(0,l.jsx)(t,{value:"manual",children:(0,l.jsxs)(d,{children:[(0,l.jsx)(a,{children:"\u5B89\u88C5\u4EE5\u4E0B\u4F9D\u8D56\u9879\uFF1A"}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"bash","data-theme":"default",__rawString__:`npm install @radix-ui/react-toggle `,__npmCommand__:`npm install @radix-ui/react-toggle `,__yarnCommand__:`yarn add @radix-ui/react-toggle `,__pnpmCommand__:`pnpm add @radix-ui/react-toggle `,__bunCommand__:`bun add @radix-ui/react-toggle `,children:(0,l.jsx)(e.code,{"data-language":"bash","data-theme":"default",children:(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"npm"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" install"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" @radix-ui/react-toggle"})]})})})}),(0,l.jsx)(a,{children:"\u590D\u5236\u5E76\u7C98\u8D34\u4EE5\u4E0B\u4EE3\u7801\u5230\u4F60\u7684\u9879\u76EE\u4E2D\u3002"}),(0,l.jsxs)(p,{name:"toggle",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`"use client" import * as React from "react" import * as TogglePrimitive from "@radix-ui/react-toggle" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "@/lib/utils" const toggleVariants = cva( "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground", { variants: { variant: { default: "bg-transparent", outline: "border border-input bg-transparent hover:bg-accent hover:text-accent-foreground", }, size: { default: "h-10 px-3", sm: "h-9 px-2.5", lg: "h-11 px-5", }, }, defaultVariants: { variant: "default", size: "default", }, } ) const Toggle = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef & VariantProps >(({ className, variant, size, ...props }, ref) => ( )) Toggle.displayName = TogglePrimitive.Root.displayName export { Toggle, toggleVariants } `,__src__:"registry/default/ui/toggle.tsx",__style__:"default",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"use client"'})}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" React "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "react"'})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" TogglePrimitive "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-toggle"'})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" cva"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" VariantProps "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "class-variance-authority"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" cn "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/lib/utils"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" toggleVariants "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" cva"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variants"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" default"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "bg-transparent"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" outline"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "border border-input bg-transparent hover:bg-accent hover:text-accent-foreground"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" default"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "h-10 px-3"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" sm"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "h-9 px-2.5"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" lg"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "h-11 px-5"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" defaultVariants"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "default"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "default"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" }"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:")"})}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" React"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"forwardRef"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"<"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" React"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"ElementRef"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" React"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"ComponentPropsWithoutRef"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:""}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" &"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">(({"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ..."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"props "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"},"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:")"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" =>"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"TogglePrimitive.Root"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"toggleVariants"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"({"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}))}"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"))"})}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"displayName "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" TogglePrimitive"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Root"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"displayName"})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" toggleVariants "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`"use client" import * as React from "react" import * as TogglePrimitive from "@radix-ui/react-toggle" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "@/lib/utils" const toggleVariants = cva( "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground", { variants: { variant: { default: "bg-transparent", outline: "border border-input bg-transparent shadow-sm hover:bg-accent hover:text-accent-foreground", }, size: { default: "h-9 px-3", sm: "h-8 px-2", lg: "h-10 px-3", }, }, defaultVariants: { variant: "default", size: "default", }, } ) const Toggle = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef & VariantProps >(({ className, variant, size, ...props }, ref) => ( )) Toggle.displayName = TogglePrimitive.Root.displayName export { Toggle, toggleVariants } `,__src__:"registry/new-york/ui/toggle.tsx",__style__:"new-york",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"use client"'})}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" React "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "react"'})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" *"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" as"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" TogglePrimitive "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-toggle"'})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" cva"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" type"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" VariantProps "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "class-variance-authority"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" cn "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/lib/utils"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" toggleVariants "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" cva"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variants"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" default"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "bg-transparent"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" outline"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "border border-input bg-transparent shadow-sm hover:bg-accent hover:text-accent-foreground"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" default"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "h-9 px-3"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" sm"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "h-8 px-2"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" lg"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "h-10 px-3"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" defaultVariants"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "default"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:":"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "default"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" },"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" }"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:")"})}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"const"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" React"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"forwardRef"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"<"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" React"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"ElementRef"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" React"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"ComponentPropsWithoutRef"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:""}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" &"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" VariantProps"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:""})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">(({"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ..."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"props "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"},"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:")"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" =>"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"TogglePrimitive.Root"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" ref"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"ref"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"toggleVariants"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"({"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}))}"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"))"})}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"displayName "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" TogglePrimitive"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Root"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"displayName"})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" toggleVariants "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]})]})})})]}),(0,l.jsx)(a,{children:"\u66F4\u65B0 import \u8DEF\u5F84\u4EE5\u5339\u914D\u4F60\u7684\u9879\u76EE\u8BBE\u7F6E\u3002"})]})})]}),` `,(0,l.jsxs)(e.h2,{id:"\u7528\u6CD5",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u7528\u6CD5",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u7528\u6CD5"]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Toggle } from "@/components/ui/toggle" `,children:(0,l.jsx)(e.code,{"data-language":"tsx","data-theme":"default",children:(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]})})})}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`\u5207\u6362\u6309\u94AE `,children:(0,l.jsx)(e.code,{"data-language":"tsx","data-theme":"default",children:(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"\u5207\u6362\u6309\u94AE"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:""})]})})})}),` `,(0,l.jsxs)(e.h2,{id:"\u793A\u4F8B",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u793A\u4F8B",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u793A\u4F8B"]}),` `,(0,l.jsxs)(e.h3,{id:"\u9ED8\u8BA4",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u9ED8\u8BA4",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u9ED8\u8BA4"]}),` `,(0,l.jsxs)(s,{name:"toggle-demo",description:"\u4E00\u4E2A\u5207\u6362\u6309\u94AE\u7EC4\u4EF6\u3002",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Bold } from "lucide-react" import { Toggle } from "@/components/ui/toggle" export function ToggleDemo() { return ( ) } `,__src__:"registry/default/example/toggle-demo.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Bold "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "lucide-react"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleDemo"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle bold"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Bold className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { FontBoldIcon } from "@radix-ui/react-icons" import { Toggle } from "@/components/ui/toggle" export function ToggleDemo() { return ( ) } `,__src__:"registry/new-york/example/toggle-demo.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" FontBoldIcon "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-icons"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleDemo"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"FontBoldIcon className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"\u8F6E\u5ED3",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u8F6E\u5ED3",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u8F6E\u5ED3"]}),` `,(0,l.jsxs)(s,{name:"toggle-outline",description:"\u4E00\u4E2A\u4F7F\u7528\u8F6E\u5ED3\u53D8\u91CF\u7684\u5207\u6362\u6309\u94AE\u7EC4\u4EF6\u3002",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Italic } from "lucide-react" import { Toggle } from "@/components/ui/toggle" export function ToggleOutline() { return ( ) } `,__src__:"registry/default/example/toggle-outline.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Italic "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "lucide-react"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleOutline"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"outline"'}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Italic className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { FontItalicIcon } from "@radix-ui/react-icons" import { Toggle } from "@/components/ui/toggle" export function ToggleOutline() { return ( ) } `,__src__:"registry/new-york/example/toggle-outline.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" FontItalicIcon "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-icons"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleOutline"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle variant"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"outline"'}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"FontItalicIcon className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"\u5E26\u6587\u5B57",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u5E26\u6587\u5B57",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u5E26\u6587\u5B57"]}),` `,(0,l.jsxs)(s,{name:"toggle-with-text",description:"\u4E00\u4E2A\u5E26\u6709\u6587\u5B57\u7684\u5207\u6362\u6309\u94AE\u7EC4\u4EF6\u3002",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Italic } from "lucide-react" import { Toggle } from "@/components/ui/toggle" export function ToggleWithText() { return ( Italic ) } `,__src__:"registry/default/example/toggle-with-text.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Italic "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "lucide-react"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleWithText"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Italic className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"mr-2 h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Italic"})}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { FontItalicIcon } from "@radix-ui/react-icons" import { Toggle } from "@/components/ui/toggle" export function ToggleWithText() { return ( Italic ) } `,__src__:"registry/new-york/example/toggle-with-text.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" FontItalicIcon "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-icons"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleWithText"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"FontItalicIcon className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"mr-2 h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Italic"})}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"\u5C0F\u53F7",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u5C0F\u53F7",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u5C0F\u53F7"]}),` `,(0,l.jsxs)(s,{name:"toggle-sm",description:"\u4E00\u4E2A\u5C0F\u53F7\u5207\u6362\u6309\u94AE\u7EC4\u4EF6\u3002",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Italic } from "lucide-react" import { Toggle } from "@/components/ui/toggle" export function ToggleSm() { return ( ) } `,__src__:"registry/default/example/toggle-sm.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Italic "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "lucide-react"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleSm"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"sm"'}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Italic className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { FontItalicIcon } from "@radix-ui/react-icons" import { Toggle } from "@/components/ui/toggle" export function ToggleSm() { return ( ) } `,__src__:"registry/new-york/example/toggle-sm.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" FontItalicIcon "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-icons"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleSm"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"sm"'}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"FontItalicIcon className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"\u5927\u53F7",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u5927\u53F7",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u5927\u53F7"]}),` `,(0,l.jsxs)(s,{name:"toggle-lg",description:"\u4E00\u4E2A\u5927\u53F7\u5207\u6362\u6309\u94AE\u7EC4\u4EF6\u3002",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Italic } from "lucide-react" import { Toggle } from "@/components/ui/toggle" export function ToggleLg() { return ( ) } `,__src__:"registry/default/example/toggle-lg.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Italic "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "lucide-react"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleLg"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"lg"'}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Italic className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { FontItalicIcon } from "@radix-ui/react-icons" import { Toggle } from "@/components/ui/toggle" export function ToggleLg() { return ( ) } `,__src__:"registry/new-york/example/toggle-lg.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" FontItalicIcon "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-icons"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleLg"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle size"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"lg"'}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"FontItalicIcon className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h3,{id:"\u7981\u7528",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u7981\u7528",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u7981\u7528"]}),` `,(0,l.jsxs)(s,{name:"toggle-disabled",description:"\u4E00\u4E2A\u7981\u7528\u7684\u5207\u6362\u6309\u94AE\u7EC4\u4EF6\u3002",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Underline } from "lucide-react" import { Toggle } from "@/components/ui/toggle" export function ToggleDisabled() { return ( ) } `,__src__:"registry/default/example/toggle-disabled.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Underline "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "lucide-react"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleDisabled"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle underline"'}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" disabled"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Underline className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { UnderlineIcon } from "@radix-ui/react-icons" import { Toggle } from "@/components/ui/toggle" export function ToggleDisabled() { return ( ) } `,__src__:"registry/new-york/example/toggle-disabled.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" UnderlineIcon "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@radix-ui/react-icons"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Toggle "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/toggle"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ToggleDisabled"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Toggle aria-label"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"Toggle italic"'}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" disabled"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"UnderlineIcon className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]})]})}function R(n={}){let{wrapper:e}=n.components||{};return e?(0,l.jsx)(e,Object.assign({},n,{children:(0,l.jsx)(m,n)})):m(n)}var P=R;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 w(k);})(); ;return Component;

切换按钮

安装

用法

示例

默认

轮廓

带文字

小号

大号

禁用