var Component=(()=>{var u=Object.create;var i=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var b=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var B=(l,n)=>()=>(n||l((n={exports:{}}).exports,n),n.exports),T=(l,n)=>{for(var r in n)i(l,r,{get:n[r],enumerable:!0})},E=(l,n,r,a)=>{if(n&&typeof n=="object"||typeof n=="function")for(let o of _(n))!x.call(l,o)&&o!==r&&i(l,o,{get:()=>n[o],enumerable:!(a=f(n,o))||a.enumerable});return l};var C=(l,n,r)=>(r=l!=null?u(b(l)):{},E(n||!l||!l.__esModule?i(r,"default",{value:l,enumerable:!0}):r,l)),v=l=>E(i({},"__esModule",{value:!0}),l);var y=B((w,g)=>{g.exports=_jsx_runtime});var I={};T(I,{default:()=>F});var e=C(y());function m(l){let n={a:"a",code:"code",figure:"figure",h2:"h2",h3:"h3",pre:"pre",span:"span",...l.components},{CodeTabs:r,ComponentPreview:a,ComponentSource:o,Step:t,Steps:p,TabsContent:c,TabsList:h,TabsTrigger:d}=n;return r||s("CodeTabs",!0),a||s("ComponentPreview",!0),o||s("ComponentSource",!0),t||s("Step",!0),p||s("Steps",!0),c||s("TabsContent",!0),h||s("TabsList",!0),d||s("TabsTrigger",!0),(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(a,{name:"toggle-demo",description:"A toggle component.",children:(0,e.jsx)(n.figure,{__src__:"registry/default/examples/toggle-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`import { BoldIcon } from "@fingertip/icons"; import { Toggle } from "@/components/ui/toggle"; export function ToggleDemo() { return ( ); } `,__src__:"registry/default/examples/toggle-demo.tsx",children:(0,e.jsxs)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:[(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { BoldIcon } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@fingertip/icons"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/components/ui/toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" function"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" ToggleDemo"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"() {"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" return"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"Toggle"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" aria-label"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"Toggle bold"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"BoldIcon"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" className"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-4 w-4"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" />"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"}"})})]})})})}),` `,(0,e.jsxs)(n.h2,{id:"installation",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#installation",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"Installation"]}),` `,(0,e.jsxs)(r,{children:[(0,e.jsxs)(h,{children:[(0,e.jsx)(d,{value:"cli",children:"CLI"}),(0,e.jsx)(d,{value:"manual",children:"Manual"})]}),(0,e.jsx)(c,{value:"cli",children:(0,e.jsx)(n.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"bash","data-theme":"github-dark",__rawString__:`npx shadcn@latest add "https://ui.fingertip.com/r/styles/default/toggle" `,__npmCommand__:`npx shadcn@latest add "https://ui.fingertip.com/r/styles/default/toggle" `,__yarnCommand__:`npx shadcn@latest add "https://ui.fingertip.com/r/styles/default/toggle" `,__pnpmCommand__:`pnpm dlx shadcn@latest add "https://ui.fingertip.com/r/styles/default/toggle" `,__bunCommand__:`bun x --bun shadcn@latest add "https://ui.fingertip.com/r/styles/default/toggle" `,children:(0,e.jsx)(n.code,{"data-language":"bash","data-theme":"github-dark",style:{display:"grid"},children:(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:"npx"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:" shadcn@latest"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:" add"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "https://ui.fingertip.com/r/styles/default/toggle"'})]})})})})}),(0,e.jsx)(c,{value:"manual",children:(0,e.jsxs)(p,{children:[(0,e.jsx)(t,{children:"Install the following dependencies:"}),(0,e.jsx)(n.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"bash","data-theme":"github-dark",__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,e.jsx)(n.code,{"data-language":"bash","data-theme":"github-dark",style:{display:"grid"},children:(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:"npm"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:" install"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:" @radix-ui/react-toggle"})]})})})}),(0,e.jsx)(t,{children:"Copy and paste the following code into your project."}),(0,e.jsx)(o,{name:"toggle",children:(0,e.jsx)(n.figure,{__src__:"registry/default/ui/toggle.tsx",__style__:"default","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`"use client"; import * as TogglePrimitive from "@radix-ui/react-toggle"; import { cva, type VariantProps } from "class-variance-authority"; import * as React from "react"; 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-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 ", { variants: { variant: { default: "bg-transparent data-[state=on]:bg-primary data-[state=on]:text-primary-foreground", secondary: "border border-input bg-transparent hover:bg-primary hover:text-primary-foreground data-[state=on]:bg-primary data-[state=on]:text-primary-foreground", muted: "bg-muted transition-all focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-background data-[state=on]:text-foreground data-[state=on]:shadow-xs", }, size: { lg: "h-[60px] px-5", default: "h-[52px] px-4", sm: "h-9 px-3", xs: "h-9 px-2", }, }, 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,e.jsxs)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:[(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"use client"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:" *"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" as"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" TogglePrimitive "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@radix-ui/react-toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { cva, "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"type"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" VariantProps } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "class-variance-authority"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:" *"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" as"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" React "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "react"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { cn } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/lib/utils"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"const"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:" toggleVariants"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" ="}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" cva"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},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-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 "'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" {"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" variants: {"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" variant: {"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" default:"})}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "bg-transparent data-[state=on]:bg-primary data-[state=on]:text-primary-foreground"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" secondary:"})}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "border border-input bg-transparent hover:bg-primary hover:text-primary-foreground data-[state=on]:bg-primary data-[state=on]:text-primary-foreground"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" muted:"})}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "bg-muted transition-all focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-background data-[state=on]:text-foreground data-[state=on]:shadow-xs"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" size: {"})}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" lg: "}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-[60px] px-5"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" default: "}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-[52px] px-4"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" sm: "}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-9 px-3"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" xs: "}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-9 px-2"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" defaultVariants: {"})}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" variant: "}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"default"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" size: "}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"default"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:");"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"const"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:" Toggle"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" ="}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" React.forwardRef"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"<"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" React.ElementRef"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:""}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" React.ComponentPropsWithoutRef"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:""}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" &"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" VariantProps"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:""})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:">"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"(({ "}),(0,e.jsx)(n.span,{style:{color:"#FFAB70"},children:"className"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:", "}),(0,e.jsx)(n.span,{style:{color:"#FFAB70"},children:"variant"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:", "}),(0,e.jsx)(n.span,{style:{color:"#FFAB70"},children:"size"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:", "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"..."}),(0,e.jsx)(n.span,{style:{color:"#FFAB70"},children:"props"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" }, "}),(0,e.jsx)(n.span,{style:{color:"#FFAB70"},children:"ref"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:") "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"=>"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"TogglePrimitive.Root"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" ref"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"{ref}"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" className"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"{"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:"cn"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"("}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:"toggleVariants"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"({ variant, size, className }))}"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" {"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"..."}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"props}"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" />"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"));"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"Toggle.displayName "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" TogglePrimitive.Root.displayName;"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle, toggleVariants };"})]})]})})})}),(0,e.jsx)(t,{children:"Update the import paths to match your project setup."})]})})]}),` `,(0,e.jsxs)(n.h2,{id:"usage",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#usage",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"Usage"]}),` `,(0,e.jsx)(n.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`import { Toggle } from "@/components/ui/toggle"; `,children:(0,e.jsx)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/components/ui/toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]})})})}),` `,(0,e.jsx)(n.figure,{"data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`Toggle `,children:(0,e.jsx)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"<"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"Toggle"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:">Toggle"})]})})})}),` `,(0,e.jsxs)(n.h2,{id:"examples",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#examples",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"Examples"]}),` `,(0,e.jsxs)(n.h3,{id:"default",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#default",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"Default"]}),` `,(0,e.jsx)(a,{name:"toggle-demo",description:"A toggle component.",children:(0,e.jsx)(n.figure,{__src__:"registry/default/examples/toggle-demo.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`import { BoldIcon } from "@fingertip/icons"; import { Toggle } from "@/components/ui/toggle"; export function ToggleDemo() { return ( ); } `,__src__:"registry/default/examples/toggle-demo.tsx",children:(0,e.jsxs)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:[(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { BoldIcon } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@fingertip/icons"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/components/ui/toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" function"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" ToggleDemo"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"() {"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" return"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"Toggle"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" aria-label"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"Toggle bold"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"BoldIcon"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" className"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-4 w-4"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" />"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"}"})})]})})})}),` `,(0,e.jsxs)(n.h3,{id:"outline",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#outline",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"Outline"]}),` `,(0,e.jsx)(a,{name:"toggle-secondary",description:"A toggle component using the secondary variant.",children:(0,e.jsx)(n.figure,{__src__:"registry/default/examples/toggle-secondary.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`import { ItalicIcon } from "@fingertip/icons"; import { Toggle } from "@/components/ui/toggle"; export function ToggleSecondary() { return ( ); } `,__src__:"registry/default/examples/toggle-secondary.tsx",children:(0,e.jsxs)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:[(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { ItalicIcon } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@fingertip/icons"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/components/ui/toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" function"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" ToggleSecondary"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"() {"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" return"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"Toggle"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" variant"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"secondary"'}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" aria-label"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"Toggle italic"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"ItalicIcon"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" className"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-4 w-4"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" />"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"}"})})]})})})}),` `,(0,e.jsxs)(n.h3,{id:"with-text",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#with-text",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"With Text"]}),` `,(0,e.jsx)(a,{name:"toggle-with-text",description:"A toggle component with text.",children:(0,e.jsx)(n.figure,{__src__:"registry/default/examples/toggle-with-text.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`import { ItalicIcon } from "@fingertip/icons"; import { Toggle } from "@/components/ui/toggle"; export function ToggleWithText() { return ( Italic ); } `,__src__:"registry/default/examples/toggle-with-text.tsx",children:(0,e.jsxs)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:[(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { ItalicIcon } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@fingertip/icons"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/components/ui/toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" function"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" ToggleWithText"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"() {"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" return"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"Toggle"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" aria-label"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"Toggle italic"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"ItalicIcon"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" />"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" Italic"})}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"}"})})]})})})}),` `,(0,e.jsxs)(n.h3,{id:"small",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#small",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"Small"]}),` `,(0,e.jsx)(a,{name:"toggle-sm",description:"A small toggle component.",children:(0,e.jsx)(n.figure,{__src__:"registry/default/examples/toggle-sm.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`import { ItalicIcon } from "@fingertip/icons"; import { Toggle } from "@/components/ui/toggle"; export function ToggleSm() { return ( ); } `,__src__:"registry/default/examples/toggle-sm.tsx",children:(0,e.jsxs)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:[(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { ItalicIcon } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@fingertip/icons"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/components/ui/toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" function"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" ToggleSm"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"() {"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" return"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"Toggle"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" size"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"sm"'}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" aria-label"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"Toggle italic"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"ItalicIcon"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" className"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-4 w-4"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" />"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"}"})})]})})})}),` `,(0,e.jsxs)(n.h3,{id:"large",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#large",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"Large"]}),` `,(0,e.jsx)(a,{name:"toggle-lg",description:"A large toggle component.",children:(0,e.jsx)(n.figure,{__src__:"registry/default/examples/toggle-lg.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`import { ItalicIcon } from "@fingertip/icons"; import { Toggle } from "@/components/ui/toggle"; export function ToggleLg() { return ( ); } `,__src__:"registry/default/examples/toggle-lg.tsx",children:(0,e.jsxs)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:[(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { ItalicIcon } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@fingertip/icons"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/components/ui/toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" function"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" ToggleLg"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"() {"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" return"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"Toggle"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" size"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"lg"'}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" aria-label"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"Toggle italic"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"ItalicIcon"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" className"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-4 w-4"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" />"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"}"})})]})})})}),` `,(0,e.jsxs)(n.h3,{id:"disabled",children:[(0,e.jsx)(n.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#disabled",children:(0,e.jsx)(n.span,{className:"icon icon-link"})}),"Disabled"]}),` `,(0,e.jsx)(a,{name:"toggle-disabled",description:"A disabled toggle component.",children:(0,e.jsx)(n.figure,{__src__:"registry/default/examples/toggle-disabled.tsx","data-rehype-pretty-code-figure":"",children:(0,e.jsx)(n.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-dark",__rawString__:`import { UnderlineIcon } from "@fingertip/icons"; import { Toggle } from "@/components/ui/toggle"; export function ToggleDisabled() { return ( ); } `,__src__:"registry/default/examples/toggle-disabled.tsx",children:(0,e.jsxs)(n.code,{"data-language":"tsx","data-theme":"github-dark",style:{display:"grid"},children:[(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { UnderlineIcon } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@fingertip/icons"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"import"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" { Toggle } "}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"from"}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:' "@/components/ui/toggle"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:" "}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"export"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" function"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" ToggleDisabled"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"() {"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#F97583"},children:" return"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"Toggle"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" aria-label"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"Toggle underline"'}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" disabled"}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" <"}),(0,e.jsx)(n.span,{style:{color:"#79B8FF"},children:"UnderlineIcon"}),(0,e.jsx)(n.span,{style:{color:"#B392F0"},children:" className"}),(0,e.jsx)(n.span,{style:{color:"#F97583"},children:"="}),(0,e.jsx)(n.span,{style:{color:"#9ECBFF"},children:'"h-4 w-4"'}),(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" />"})]}),` `,(0,e.jsxs)(n.span,{"data-line":"",children:[(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,e.jsx)(n.span,{"data-line":"",children:(0,e.jsx)(n.span,{style:{color:"#E1E4E8"},children:"}"})})]})})})})]})}function F(l={}){let{wrapper:n}=l.components||{};return n?(0,e.jsx)(n,{...l,children:(0,e.jsx)(m,{...l})}):m(l)}function s(l,n){throw new Error("Expected "+(n?"component":"object")+" `"+l+"` to be defined: you likely forgot to import, pass, or provide it.")}return v(I);})(); ;return Component;