{"$schema":"https://ui.shadcn.com/schema/registry-item.json","author":"Eduardo Calvo <edu@smoothui.dev>","css":{},"dependencies":["@base-ui/react","motion"],"description":"Animated Toggle primitive for SmoothUI with press scale and pressed background.","devDependencies":[],"files":[{"content":"\"use client\";\n\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\";\nimport { cn } from \"@/lib/utils\";\nimport { motion, useReducedMotion } from \"motion/react\";\nimport type { ComponentPropsWithRef } from \"react\";\nimport {\n  PRESS_SCALE,\n  PRESS_TRANSITION,\n  SPRING_SNAPPY,\n} from \"@/components/smoothui/lib/animation\";\n\ninterface ToggleOwnProps {\n  /** Accessible name when no visible text */\n  \"aria-label\"?: string;\n  /** Children rendered inside the toggle */\n  children?: React.ReactNode;\n  /** Optional CSS class */\n  className?: string;\n  /** Uncontrolled initial pressed state */\n  defaultPressed?: boolean;\n  /** Whether the toggle is disabled */\n  disabled?: boolean;\n  /** Callback when pressed state changes */\n  onPressedChange?: (pressed: boolean) => void;\n  /** Controlled pressed state */\n  pressed?: boolean;\n  /** Value when used inside a ToggleGroup */\n  value?: string;\n}\n\n/**\n * Native `<button>` attributes forwarded to the control: `ref`, `aria-*`,\n * `data-*`, `onBlur`, `onFocus` and the rest, so form libraries and error\n * wiring (`aria-describedby`, `aria-invalid`) reach the element.\n */\ntype ToggleNativeProps = Omit<\n  ComponentPropsWithRef<\"button\">,\n  keyof ToggleOwnProps | \"defaultValue\" | \"onChange\" | \"type\"\n>;\n\nexport type ToggleProps = ToggleOwnProps & ToggleNativeProps;\n\nconst MotionButton = motion.button;\n\n/**\n * SmoothUI Toggle — Base UI twin (default).\n * Pressed background + spring scale on press.\n */\nexport default function Toggle({\n  \"aria-label\": ariaLabel,\n  className,\n  children,\n  defaultPressed = false,\n  disabled = false,\n  onPressedChange,\n  pressed,\n  value,\n  ...props\n}: ToggleProps) {\n  const shouldReduceMotion = useReducedMotion();\n\n  return (\n    <TogglePrimitive\n      {...props}\n      aria-label={ariaLabel}\n      className={cn(\n        \"pointer-coarse:after:-translate-1/2 relative inline-flex h-9 shrink-0 select-none items-center justify-center gap-2 rounded-md border border-transparent px-3 font-medium text-sm outline-none pointer-coarse:after:absolute pointer-coarse:after:top-1/2 pointer-coarse:after:left-1/2 pointer-coarse:after:size-full pointer-coarse:after:min-h-10 pointer-coarse:after:min-w-10 pointer-coarse:after:content-['']\",\n        \"bg-secondary text-muted-foreground\",\n        \"state-transition focus-ring hover:bg-muted\",\n        \"data-pressed:border-border data-pressed:bg-background data-pressed:text-foreground data-pressed:shadow-sm dark:data-pressed:bg-foreground/15\",\n        \"data-disabled:pointer-events-none data-disabled:border-foreground/25 data-disabled:bg-foreground/10 data-disabled:text-muted-foreground\",\n        className\n      )}\n      data-slot=\"toggle\"\n      defaultPressed={defaultPressed}\n      disabled={disabled}\n      onPressedChange={(next) => {\n        onPressedChange?.(next);\n      }}\n      pressed={pressed}\n      render={\n        <MotionButton\n          transition={shouldReduceMotion ? { duration: 0 } : SPRING_SNAPPY}\n          type=\"button\"\n          whileTap={\n            shouldReduceMotion\n              ? undefined\n              : { scale: PRESS_SCALE, transition: PRESS_TRANSITION }\n          }\n        />\n      }\n      value={value}\n    >\n      {children}\n    </TogglePrimitive>\n  );\n}\n","path":"index.tsx","target":"components/smoothui/toggle/index.tsx","type":"registry:ui"}],"name":"toggle","registryDependencies":["https://smoothui.dev/r/lib.json","https://smoothui.dev/r/tokens.json"],"title":"Toggle","type":"registry:ui"}