{
  "name": "disclosure",
  "type": "registry:ui",
  "registryDependencies": [],
  "dependencies": [
    "motion"
  ],
  "devDependencies": [],
  "tailwind": {},
  "cssVars": {
    "light": {},
    "dark": {}
  },
  "files": [
    {
      "path": "disclosure.tsx",
      "content": "'use client';\nimport * as React from 'react';\nimport {\n  AnimatePresence,\n  motion,\n  MotionConfig,\n  Transition,\n  Variant,\n  Variants,\n} from 'motion/react';\nimport { createContext, useContext, useState, useId, useEffect } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type DisclosureContextType = {\n  open: boolean;\n  toggle: () => void;\n  variants?: { expanded: Variant; collapsed: Variant };\n};\n\nconst DisclosureContext = createContext<DisclosureContextType | undefined>(\n  undefined\n);\n\nexport type DisclosureProviderProps = {\n  children: React.ReactNode;\n  open: boolean;\n  onOpenChange?: (open: boolean) => void;\n  variants?: { expanded: Variant; collapsed: Variant };\n};\n\nfunction DisclosureProvider({\n  children,\n  open: openProp,\n  onOpenChange,\n  variants,\n}: DisclosureProviderProps) {\n  const [internalOpenValue, setInternalOpenValue] = useState<boolean>(openProp);\n\n  useEffect(() => {\n    setInternalOpenValue(openProp);\n  }, [openProp]);\n\n  const toggle = () => {\n    const newOpen = !internalOpenValue;\n    setInternalOpenValue(newOpen);\n    if (onOpenChange) {\n      onOpenChange(newOpen);\n    }\n  };\n\n  return (\n    <DisclosureContext.Provider\n      value={{\n        open: internalOpenValue,\n        toggle,\n        variants,\n      }}\n    >\n      {children}\n    </DisclosureContext.Provider>\n  );\n}\n\nfunction useDisclosure() {\n  const context = useContext(DisclosureContext);\n  if (!context) {\n    throw new Error('useDisclosure must be used within a DisclosureProvider');\n  }\n  return context;\n}\n\nexport type DisclosureProps = {\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children: React.ReactNode;\n  className?: string;\n  variants?: { expanded: Variant; collapsed: Variant };\n  transition?: Transition;\n};\n\nexport function Disclosure({\n  open: openProp = false,\n  onOpenChange,\n  children,\n  className,\n  transition,\n  variants,\n}: DisclosureProps) {\n  return (\n    <MotionConfig transition={transition}>\n      <div className={className}>\n        <DisclosureProvider\n          open={openProp}\n          onOpenChange={onOpenChange}\n          variants={variants}\n        >\n          {React.Children.toArray(children)[0]}\n          {React.Children.toArray(children)[1]}\n        </DisclosureProvider>\n      </div>\n    </MotionConfig>\n  );\n}\n\nexport function DisclosureTrigger({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  const { toggle, open } = useDisclosure();\n\n  return (\n    <>\n      {React.Children.map(children, (child) => {\n        return React.isValidElement(child)\n          ? React.cloneElement(child, {\n              onClick: toggle,\n              role: 'button',\n              'aria-expanded': open,\n              tabIndex: 0,\n              onKeyDown: (e: { key: string; preventDefault: () => void }) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  toggle();\n                }\n              },\n              className: cn(\n                className,\n                (child as React.ReactElement).props.className\n              ),\n              ...(child as React.ReactElement).props,\n            })\n          : child;\n      })}\n    </>\n  );\n}\n\nexport function DisclosureContent({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  const { open, variants } = useDisclosure();\n  const uniqueId = useId();\n\n  const BASE_VARIANTS: Variants = {\n    expanded: {\n      height: 'auto',\n      opacity: 1,\n    },\n    collapsed: {\n      height: 0,\n      opacity: 0,\n    },\n  };\n\n  const combinedVariants = {\n    expanded: { ...BASE_VARIANTS.expanded, ...variants?.expanded },\n    collapsed: { ...BASE_VARIANTS.collapsed, ...variants?.collapsed },\n  };\n\n  return (\n    <div className={cn('overflow-hidden', className)}>\n      <AnimatePresence initial={false}>\n        {open && (\n          <motion.div\n            id={uniqueId}\n            initial='collapsed'\n            animate='expanded'\n            exit='collapsed'\n            variants={combinedVariants}\n          >\n            {children}\n          </motion.div>\n        )}\n      </AnimatePresence>\n    </div>\n  );\n}\n\nexport default {\n  Disclosure,\n  DisclosureProvider,\n  DisclosureTrigger,\n  DisclosureContent,\n};\n",
      "type": "registry:ui"
    }
  ]
}