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:T2dac,'use client'; import React, { createContext, useContext, useState, useRef, useCallback, useEffect, forwardRef, } from 'react'; import { createPortal } from 'react-dom'; import { motion, useAnimation, PanInfo, useMotionValue, useTransform, } from 'motion/react'; import { cn } from '@/lib/utils'; interface TopSheetContextValue { isOpen: boolean; onOpenChange: (open: boolean) => void; contentProps: { height: string; className: string; closeThreshold: number; }; } const TopSheetContext = createContext(null); const useTopSheetContext = () => { const context = useContext(TopSheetContext); if (!context) { throw new Error( 'TopSheet compound components must be used within TopSheet', ); } return context; }; interface TopSheetRootProps { children: React.ReactNode; open?: boolean; onOpenChange?: (open: boolean) => void; defaultOpen?: boolean; className?: string; } const TopSheetRoot = ({ children, open, onOpenChange, defaultOpen, className, }: TopSheetRootProps) => { const [internalOpen, setInternalOpen] = useState(defaultOpen ?? false); const isControlled = open !== undefined; const isOpen = isControlled ? open : internalOpen; const handleOpenChange = useCallback( (newOpen: boolean) => { if (onOpenChange) { onOpenChange(newOpen); } if (!isControlled) { setInternalOpen(newOpen); } }, [onOpenChange, isControlled], ); const contentProps = { height: '55vh', className: className || '', closeThreshold: 0.3, }; return ( {children} ); }; interface TopSheetPortalProps { children: React.ReactNode; container?: HTMLElement; className?: string; } const TopSheetPortal = ({ children, container, className, }: TopSheetPortalProps) => { const [mounted, setMounted] = useState(false); useEffect(() => { Promise.resolve().then(() => setMounted(true)); }, []); if (!mounted || typeof document === 'undefined') { return null; } const portalContent = className ? (

{children}

) : ( children ); return createPortal(portalContent, container || document.body); }; interface TopSheetOverlayProps extends React.HTMLAttributes { className?: string; } const TopSheetOverlay = forwardRef( ({ className, onClick, ...props }, ref) => { const { isOpen, onOpenChange } = useTopSheetContext(); const handleClick = useCallback( (e: React.MouseEvent) => { if (e.target === e.currentTarget) { onOpenChange(false); } onClick?.(e); }, [onOpenChange, onClick], ); return ( ); }, ); TopSheetOverlay.displayName = 'TopSheetOverlay'; interface TopSheetTriggerProps { asChild?: boolean; children: React.ReactNode; className?: string; } const TopSheetTrigger = ({ asChild, children, className, }: TopSheetTriggerProps) => { const { onOpenChange } = useTopSheetContext(); const handleClick = () => { onOpenChange(true); }; if (asChild && React.isValidElement(children)) { const childProps = children.props as { className?: string; onClick?: (e: React.MouseEvent) => void; }; return React.cloneElement(children, { className: cn(childProps.className, className), onClick: (e: React.MouseEvent) => { childProps.onClick?.(e); handleClick(); }, } as Partial); } return ( ); }; interface TopSheetContentProps { children?: React.ReactNode; height?: string; className?: string; closeThreshold?: number; } const TopSheetContent = ({ children, height = '55vh', className = '', closeThreshold = 0.3, }: TopSheetContentProps) => { const { isOpen, onOpenChange } = useTopSheetContext(); const controls = useAnimation(); const y = useMotionValue(0); useTransform(y, [-100, 0], [0, 1]); const overlayRef = useRef(null); const [sheetHeight, setSheetHeight] = useState(0); const onClose = useCallback(() => onOpenChange(false), [onOpenChange]); const calculateHeight = useCallback(() => { if (typeof window !== 'undefined') { const vh = window.innerHeight; const vw = window.innerWidth; let calculatedHeight; if (vw <= 640) { calculatedHeight = vh * 0.6; } else if (vw <= 1024) { calculatedHeight = vh * 0.55; } else { calculatedHeight = vh * 0.5; } if (height.includes('vh')) { calculatedHeight = (parseInt(height) / 100) * vh; } else if (height.includes('px')) { calculatedHeight = parseInt(height); } return Math.min(calculatedHeight, vh * 0.8); } return 400; }, [height]); useEffect(() => { const updateHeight = () => { setSheetHeight(calculateHeight()); }; updateHeight(); window.addEventListener('resize', updateHeight); return () => window.removeEventListener('resize', updateHeight); }, [calculateHeight]); useEffect(() => { if (isOpen) { document.body.style.overflow = 'hidden'; controls.start({ y: 0, transition: { type: 'spring', stiffness: 400, damping: 40, mass: 0.8, }, }); } else { document.body.style.overflow = ''; controls.start({ y: -(sheetHeight + 50), transition: { type: 'tween', ease: [0.25, 0.46, 0.45, 0.94], duration: 0.3, }, }); } return () => { document.body.style.overflow = ''; }; }, [isOpen, controls, sheetHeight]); useEffect(() => { const handleEscape = (e: KeyboardEvent) => { if (e.key === 'Escape' && isOpen) { onClose(); } }; if (isOpen) { document.addEventListener('keydown', handleEscape); } return () => { document.removeEventListener('keydown', handleEscape); }; }, [isOpen, onClose]); const handleDragEnd = useCallback( (event: MouseEvent | TouchEvent | PointerEvent, info: PanInfo) => { const shouldClose = info.offset.y < -(sheetHeight * closeThreshold) || info.velocity.y < -800; if (shouldClose) { onClose(); } else { controls.start({ y: 0, transition: { type: 'spring', stiffness: 500, damping: 40, }, }); } }, [controls, onClose, closeThreshold, sheetHeight], ); const handleOverlayClick = useCallback( (e: React.MouseEvent) => { if (e.target === overlayRef.current) { onClose(); } }, [onClose], ); if (sheetHeight === 0) return null; return (

{children}

); }; interface TopSheetHeaderProps { children: React.ReactNode; className?: string; } const TopSheetHeader = ({ children, className }: TopSheetHeaderProps) => { return (

{children}

); }; interface TopSheetTitleProps { children: React.ReactNode; className?: string; } const TopSheetTitle = ({ children, className }: TopSheetTitleProps) => { return (

{children}

); }; interface TopSheetDescriptionProps { children: React.ReactNode; className?: string; } const TopSheetDescription = ({ children, className, }: TopSheetDescriptionProps) => { return (

{children}

); }; interface TopSheetFooterProps { children: React.ReactNode; className?: string; } const TopSheetFooter = ({ children, className }: TopSheetFooterProps) => { return (

{children}

); }; interface TopSheetCloseProps { asChild?: boolean; children: React.ReactNode; className?: string; } const TopSheetClose = ({ asChild, children, className, }: TopSheetCloseProps) => { const { onOpenChange } = useTopSheetContext(); const handleClick = () => { onOpenChange(false); }; if (asChild && React.isValidElement(children)) { const childProps = children.props as { className?: string; onClick?: (e: React.MouseEvent) => void; }; return React.cloneElement(children, { className: cn(childProps.className, className), onClick: (e: React.MouseEvent) => { childProps.onClick?.(e); handleClick(); }, } as Partial); } return ( ); }; const TopSheet = TopSheetRoot; export { TopSheet, TopSheetPortal, TopSheetOverlay, TopSheetTrigger, TopSheetClose, TopSheetContent, TopSheetHeader, TopSheetFooter, TopSheetTitle, TopSheetDescription, }; 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","motion",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/motion","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"motion"}]]}]}],["$","li","clsx",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/clsx","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"clsx"}]]}]}],["$","li","tailwind-merge",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/tailwind-merge","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"tailwind-merge"}]]}]}]]}],["$","$L50",null,{"namespace":"@scrollxui","registryDependencies":[]}]]}],null]}],["$","$L51",null,{"files":[{"path":"components/ui/top-sheet.tsx","content":"$52","type":"registry:ui"},{"path":"lib/utils.ts","content":"import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}","type":"registry:lib"}],"className":"h-[70svh] min-h-80"}]]}]