{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "primitives-radix-toggle",
  "title": "Radix Toggle",
  "description": "A two-state button that can be either on or off.",
  "dependencies": [
    "motion",
    "radix-ui"
  ],
  "registryDependencies": [
    "@odysseyui/lib-get-strict-context",
    "@odysseyui/hooks-use-controlled-state"
  ],
  "files": [
    {
      "path": "registry/primitives/radix/toggle/index.tsx",
      "content": "'use client';\n\nimport * as React from 'react';\nimport { Toggle as TogglePrimitive } from 'radix-ui';\nimport { motion, AnimatePresence, type HTMLMotionProps } from 'motion/react';\n\nimport { getStrictContext } from '@/lib/get-strict-context';\nimport { useControlledState } from '@/hooks/use-controlled-state';\n\ntype ToggleContextType = {\n  isPressed: boolean;\n  setIsPressed: (isPressed: boolean) => void;\n  disabled?: boolean;\n};\n\nconst [ToggleProvider, useToggle] =\n  getStrictContext<ToggleContextType>('ToggleContext');\n\ntype ToggleProps = Omit<\n  React.ComponentProps<typeof TogglePrimitive.Root>,\n  'asChild'\n> &\n  HTMLMotionProps<'button'>;\n\nfunction Toggle({\n  pressed,\n  defaultPressed,\n  onPressedChange,\n  disabled,\n  ...props\n}: ToggleProps) {\n  const [isPressed, setIsPressed] = useControlledState({\n    value: pressed,\n    defaultValue: defaultPressed,\n    onChange: onPressedChange,\n  });\n\n  return (\n    <ToggleProvider value={{ isPressed, setIsPressed, disabled }}>\n      <TogglePrimitive.Root\n        pressed={pressed}\n        defaultPressed={defaultPressed}\n        onPressedChange={setIsPressed}\n        disabled={disabled}\n        asChild\n      >\n        <motion.button\n          data-slot=\"toggle\"\n          whileTap={{ scale: 0.95 }}\n          {...props}\n        />\n      </TogglePrimitive.Root>\n    </ToggleProvider>\n  );\n}\n\ntype ToggleHighlightProps = HTMLMotionProps<'div'>;\n\nfunction ToggleHighlight({ style, ...props }: ToggleHighlightProps) {\n  const { isPressed, disabled } = useToggle();\n\n  return (\n    <AnimatePresence>\n      {isPressed && (\n        <motion.div\n          data-slot=\"toggle-highlight\"\n          aria-pressed={isPressed}\n          data-state={isPressed ? 'on' : 'off'}\n          data-disabled={disabled}\n          style={{ position: 'absolute', zIndex: 0, inset: 0, ...style }}\n          initial={{ opacity: 0 }}\n          animate={{ opacity: 1 }}\n          exit={{ opacity: 0 }}\n          {...props}\n        />\n      )}\n    </AnimatePresence>\n  );\n}\n\ntype ToggleItemProps = HTMLMotionProps<'div'>;\n\nfunction ToggleItem({ style, ...props }: ToggleItemProps) {\n  const { isPressed, disabled } = useToggle();\n\n  return (\n    <motion.div\n      data-slot=\"toggle-item\"\n      aria-pressed={isPressed}\n      data-state={isPressed ? 'on' : 'off'}\n      data-disabled={disabled}\n      style={{ position: 'relative', zIndex: 1, ...style }}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Toggle,\n  ToggleHighlight,\n  ToggleItem,\n  useToggle,\n  type ToggleProps,\n  type ToggleHighlightProps,\n  type ToggleItemProps,\n  type ToggleContextType,\n};\n",
      "type": "registry:ui",
      "target": "components/odysseyui/primitives/radix/toggle.tsx"
    }
  ],
  "type": "registry:ui"
}