4f: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"] 50: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"] 51:T1e19,"use client"; import type { VariantProps } from "cva"; import { AnimatePresence, motion, type PanInfo, type Point, type TargetAndTransition, } from "motion/react"; import { use } from "react"; import { Button, composeRenderProps, Dialog, DialogTrigger, Heading, Modal, ModalOverlay, OverlayTriggerStateContext, Text, } from "react-aria-components"; import { DrawerStyles } from "./styles"; const MotionModal = motion.create(Modal); const MotionModalOverlay = motion.create(ModalOverlay); const TRANSITIONS = { DURATION: 0.5, EASE: [0.32, 0.72, 0, 1], }; const VELOCITY_THRESHOLD = 0.4; const CLOSE_THRESHOLD = 0.25; type DrawerSide = "top" | "right" | "bottom" | "left"; const initialTransform = { bottom: { y: "100%" }, left: { x: "-100%" }, right: { x: "100%" }, top: { y: "-100%" }, } as const satisfies Record; function getIsVertical(side: DrawerSide): boolean { return side === "top" || side === "bottom"; } // Check if drag should close the drawer function shouldClose( side: DrawerSide, offset: Point, velocity: Point ): boolean { const isVertical = getIsVertical(side); const dragDistance = isVertical ? Math.abs(offset.y) : Math.abs(offset.x); const dragVelocity = isVertical ? Math.abs(velocity.y) : Math.abs(velocity.x); // Check if dragging in close direction const isClosingDirection = (side === "bottom" && offset.y > 0) || (side === "top" && offset.y < 0) || (side === "left" && offset.x < 0) || (side === "right" && offset.x > 0); if (!isClosingDirection) { return false; } // Close on high velocity if (dragVelocity > VELOCITY_THRESHOLD) { return true; } // Close on distance threshold const threshold = (isVertical ? window.innerHeight : window.innerWidth) * CLOSE_THRESHOLD; return dragDistance >= threshold; } type DragOrientation = "x" | "y"; // Get drag configuration for each side function getDragConfig(side: DrawerSide) { const isVertical = getIsVertical(side); const drag: DragOrientation = isVertical ? "y" : "x"; return { drag, dragConstraints: isVertical ? side === "top" ? { bottom: 5, top: -300 } // More restrictive for scrollable content : { bottom: 300, top: -5 } // Very limited upward movement : side === "left" ? { left: -300, right: 5 } : { left: -5, right: 300 }, dragElastic: isVertical ? side === "top" ? { bottom: 0.02, top: 0.15 } // Higher resistance near content : { bottom: 0.15, top: 0.02 } // Very high resistance upward : side === "left" ? { left: 0.15, right: 0.02 } : { left: 0.02, right: 0.15 }, }; } export interface DrawerRootProps extends React.ComponentProps {} export function DrawerRoot(props: DrawerRootProps) { return ; } export interface DrawerOverlayProps extends Omit, "children">, VariantProps { children: React.ComponentProps["children"]; /** * Whether to close the modal when the user interacts outside it. * @default true */ isDismissable?: boolean; /** * Whether the drawer should float with margins. * @default false */ isFloat?: boolean; /** * Whether to show the drag notch indicator. * @default true */ notch?: boolean; } export function DrawerOverlay({ className, isDismissable = true, side = "bottom", isFloat = false, notch = true, children, ...props }: DrawerOverlayProps) { const state = use(OverlayTriggerStateContext); if (!state) { return null; } const handleDragEnd = (_: unknown, { offset, velocity }: PanInfo) => { if (shouldClose(side, offset, velocity)) { state.close(); } }; const dragConfig = getDragConfig(side); return ( {(props?.isOpen || state?.isOpen) && ( )} ); } export interface DrawerHeaderProps extends React.ComponentProps<"div"> {} export function DrawerHeader({ className, ...props }: DrawerHeaderProps) { return (

); } export interface DrawerTitleProps extends React.ComponentProps {} export function DrawerTitle({ className, ...props }: DrawerTitleProps) { return ( ); } export interface DrawerDescriptionProps extends React.ComponentProps {} export function DrawerDescription({ className, ...props }: DrawerDescriptionProps) { return ( ); } export interface DrawerBodyProps extends React.ComponentProps<"div"> {} export function DrawerBody({ className, ...props }: DrawerBodyProps) { return (

); } export interface DrawerFooterProps extends React.ComponentProps<"div"> {} export function DrawerFooter({ className, ...props }: DrawerFooterProps) { return (

); } export interface DrawerCloseProps extends React.ComponentProps {} export function DrawerClose({ className, ...props }: DrawerCloseProps) { return (