@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
1 lines • 6.07 kB
Source Map (JSON)
{"version":3,"file":"use-hover-card.cjs","names":["HoverCardGroupContext"],"sources":["../../../src/components/HoverCard/use-hover-card.ts"],"sourcesContent":["import { use, useCallback, useEffect, useRef, useState } from 'react';\nimport {\n useDelayGroup,\n useDismiss,\n useFloating,\n useHover,\n useInteractions,\n useRole,\n} from '@floating-ui/react';\nimport { useId } from '@mantine/hooks';\nimport { HoverCardGroupContext } from './HoverCardGroup/HoverCardGroup';\n\ninterface UseHoverCard {\n openDelay?: number;\n closeDelay?: number;\n opened?: boolean;\n defaultOpened?: boolean;\n onOpen?: () => void;\n onClose?: () => void;\n}\n\nexport function useHoverCard(settings: UseHoverCard) {\n const [uncontrolledOpened, setUncontrolledOpened] = useState(settings.defaultOpened);\n const controlled = typeof settings.opened === 'boolean';\n const opened = controlled ? settings.opened : uncontrolledOpened;\n const withinGroup = use(HoverCardGroupContext).withinGroup;\n const uid = useId();\n\n const openTimeout = useRef(-1);\n const closeTimeout = useRef(-1);\n const targetRef = useRef<HTMLElement | null>(null);\n\n const assignTarget = useCallback((node: HTMLElement | null) => {\n targetRef.current = node;\n }, []);\n\n const clearTimeouts = useCallback(() => {\n window.clearTimeout(openTimeout.current);\n window.clearTimeout(closeTimeout.current);\n }, []);\n\n const onChange = useCallback(\n (_opened: boolean) => {\n setUncontrolledOpened(_opened);\n\n if (_opened) {\n setCurrentId(uid);\n settings.onOpen?.();\n } else {\n settings.onClose?.();\n }\n },\n [uid, settings.onOpen, settings.onClose]\n );\n\n const { context, refs } = useFloating({\n open: opened,\n onOpenChange: onChange,\n });\n\n const { delay: groupDelay, setCurrentId } = useDelayGroup(context, { id: uid });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useHover(context, {\n enabled: true,\n delay: withinGroup ? groupDelay : { open: settings.openDelay, close: settings.closeDelay },\n }),\n useRole(context, { role: 'dialog' }),\n useDismiss(context, { enabled: withinGroup }),\n ]);\n\n const openDropdown = useCallback(() => {\n if (withinGroup) {\n return; // Group mode handles this automatically\n }\n\n clearTimeouts();\n if (settings.openDelay === 0 || settings.openDelay === undefined) {\n onChange(true);\n } else {\n openTimeout.current = window.setTimeout(() => onChange(true), settings.openDelay);\n }\n }, [withinGroup, clearTimeouts, settings.openDelay, onChange]);\n\n const closeDropdown = useCallback(() => {\n if (withinGroup) {\n return; // Group mode handles this automatically\n }\n\n clearTimeouts();\n if (settings.closeDelay === 0 || settings.closeDelay === undefined) {\n onChange(false);\n } else {\n closeTimeout.current = window.setTimeout(() => onChange(false), settings.closeDelay);\n }\n }, [withinGroup, clearTimeouts, settings.closeDelay, onChange]);\n\n const onChangeRef = useRef(onChange);\n onChangeRef.current = onChange;\n\n useEffect(() => () => clearTimeouts(), [clearTimeouts]);\n\n useEffect(() => {\n if (!opened || withinGroup || typeof IntersectionObserver === 'undefined') {\n return undefined;\n }\n\n const node = targetRef.current;\n if (!node) {\n return undefined;\n }\n\n const observer = new IntersectionObserver(() => {\n if (!node.isConnected || node.getClientRects().length === 0) {\n clearTimeouts();\n onChangeRef.current(false);\n }\n });\n\n observer.observe(node);\n return () => observer.disconnect();\n }, [opened, withinGroup, clearTimeouts]);\n\n return {\n opened,\n reference: refs.setReference,\n floating: refs.setFloating,\n assignTarget,\n getReferenceProps,\n getFloatingProps,\n openDropdown,\n closeDropdown,\n };\n}\n"],"mappings":"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"}