50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T1a33,'use client'; import { cn } from '@/lib/utils'; import { cva, VariantProps } from 'class-variance-authority'; import { AnimatePresence, HTMLMotionProps, motion, MotionConfig, Variants, } from 'motion/react'; import React from 'react'; export function useClickOutside( callback: () => void, enabled = true, ) { const ref = React.useRef(null); const callbackRef = React.useRef(callback); React.useEffect(() => { callbackRef.current = callback; }, [callback]); React.useEffect(() => { if (!enabled) return; const handleClick = (event: MouseEvent) => { const element = ref.current; if (!element) return; if (!element.contains(event.target as Node)) { callbackRef.current(); } }; document.addEventListener('click', handleClick); return () => { document.removeEventListener('click', handleClick); }; }, [enabled]); return ref; } const menuListVariants = { open: { width: 320, height: 420, transition: { duration: 0.75, ease: [0.76, 0, 0.24, 1] }, }, close: { width: 80, height: 32, transition: { duration: 0.75, delay: 0.2, ease: [0.76, 0, 0.24, 1] }, }, } as Variants; const itemVariants = { initial: { opacity: 0, }, enter: (i: number) => ({ opacity: 1, transition: { delay: 0.55 + i * 0.1, duration: 0.75, }, }), exit: (i: number) => ({ opacity: 0, transition: { delay: 0.25 + -i * 0.1, }, }), } as Variants; interface AnimatedMenuContextValue { isOpen: boolean; setIsOpen: React.Dispatch>; } interface AnimatedMenuItemProps extends HTMLMotionProps<'div'> { order?: number; variants?: Variants; } interface AnimatedMenuButtonLabelProps extends React.HTMLAttributes { closeLabel?: string; openLabel?: string; } const AnimatedMenuContext = React.createContext< AnimatedMenuContextValue | undefined >(undefined); function useAnimatedMenuContext() { const context = React.useContext(AnimatedMenuContext); if (context === undefined) { throw new Error( 'useAnimatedMenuContext must be used within an AnimatedMenuProvider', ); } return context; } export function AnimatedMenu({ className, ...props }: React.ComponentProps<'div'>) { const [isOpen, setIsOpen] = React.useState(false); return (

); } const buttonIconVariants = cva( 'flex flex-col gap-1.5 justify-center items-center p-1 relative *:bg-current', { variants: { size: { sm: '*:w-4 *:h-[1.5px] *:origin-[17%]', md: '*:w-6 *:h-0.5 *:origin-[25%]', lg: '*:w-8 *:h-0.5 *:origin-[33%]', xl: '*:w-10 *:h-1 *:origin-[31%]', }, }, defaultVariants: { size: 'sm', }, }, ); export function AnimatedMenuButtonToggleIcon({ className, size = 'sm', ...props }: React.HTMLAttributes & VariantProps) { const { isOpen } = useAnimatedMenuContext(); return (

); } export function AnimatedMenuButtonLabel({ closeLabel = 'Menu', openLabel = 'Close', className, ...props }: AnimatedMenuButtonLabelProps) { const { isOpen } = useAnimatedMenuContext(); return (

{closeLabel} {openLabel}

); } export function AnimatedMenuButton({ className, children, ...props }: React.HTMLAttributes) { const { setIsOpen } = useAnimatedMenuContext(); const toggleMenu = () => setIsOpen((prevState) => !prevState); return ( ); } export function AnimatedMenuList({ variants = menuListVariants, className, children, ...props }: React.ComponentPropsWithRef<'div'> & HTMLMotionProps<'div'>) { const { isOpen, setIsOpen } = useAnimatedMenuContext(); const ref = useClickOutside(() => { setIsOpen(false); }, isOpen); return ( {isOpen && (children as React.ReactNode)} ); } export function AnimatedMenuItem({ order = 0, variants = itemVariants, ...props }: AnimatedMenuItemProps) { return ( ); } export function CloseAnimatedMenu({ className, ...props }: React.HTMLAttributes) { const { setIsOpen } = useAnimatedMenuContext(); const closeMenu = () => setIsOpen(false); return (