UNPKG

@ariakit/react-core

Version:

Ariakit React core

134 lines (113 loc) 4.94 kB
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); var _KPH4LMZOcjs = require('../__chunks/KPH4LMZO.cjs'); var _Y35J4OLVcjs = require('../__chunks/Y35J4OLV.cjs'); var _JVADL66Kcjs = require('../__chunks/JVADL66K.cjs'); require('../__chunks/LZE4K2WU.cjs'); require('../__chunks/ZVS6SBRR.cjs'); require('../__chunks/VF7H2WBX.cjs'); require('../__chunks/EJVJIL4S.cjs'); require('../__chunks/PK35DJGA.cjs'); require('../__chunks/H5ZMZIC6.cjs'); require('../__chunks/PDQXLIRF.cjs'); require('../__chunks/T3QB4FR3.cjs'); var _6TI3NXX6cjs = require('../__chunks/6TI3NXX6.cjs'); var _L5A2ID7Scjs = require('../__chunks/L5A2ID7S.cjs'); require('../__chunks/FDRJDQ5Y.cjs'); var _7EQBAZ46cjs = require('../__chunks/7EQBAZ46.cjs'); // src/hovercard/hovercard-disclosure.tsx var _dom = require('@ariakit/core/utils/dom'); var _events = require('@ariakit/core/utils/events'); var _misc = require('@ariakit/core/utils/misc'); var _store = require('@ariakit/core/utils/store'); var _react = require('react'); var _jsxruntime = require('react/jsx-runtime'); var TagName = "button"; var useHovercardDisclosure = _6TI3NXX6cjs.createHook.call(void 0, function useHovercardDisclosure2(_a) { var _b = _a, { store } = _b, props = _7EQBAZ46cjs.__objRest.call(void 0, _b, ["store"]); const context = _KPH4LMZOcjs.useHovercardProviderContext.call(void 0, ); store = store || context; _misc.invariant.call(void 0, store, process.env.NODE_ENV !== "production" && "HovercardDisclosure must receive a `store` prop or be wrapped in a HovercardProvider component." ); const [visible, setVisible] = _react.useState.call(void 0, false); _react.useEffect.call(void 0, () => { if (!visible) return; const onBlur = (event) => { if (!store) return; const nextActiveElement = event.relatedTarget; if (nextActiveElement) { const { anchorElement: anchor, popoverElement: popover, disclosureElement: disclosure } = store.getState(); if (anchor && _dom.contains.call(void 0, anchor, nextActiveElement)) return; if (popover && _dom.contains.call(void 0, popover, nextActiveElement)) return; if (disclosure && _dom.contains.call(void 0, disclosure, nextActiveElement)) return; if (nextActiveElement.hasAttribute("data-focus-trap")) return; } setVisible(false); }; return _events.addGlobalEventListener.call(void 0, "focusout", onBlur, true); }, [visible, store]); _react.useEffect.call(void 0, () => { return _store.sync.call(void 0, store, ["anchorElement"], (state) => { const anchor = state.anchorElement; if (!anchor) return; const observer = new MutationObserver(() => { if (!anchor.hasAttribute("data-focus-visible")) return; setVisible(true); }); observer.observe(anchor, { attributeFilter: ["data-focus-visible"] }); return () => observer.disconnect(); }); }, [store]); const onClickProp = props.onClick; const onClick = _L5A2ID7Scjs.useEvent.call(void 0, (event) => { onClickProp == null ? void 0 : onClickProp(event); if (event.defaultPrevented) return; store == null ? void 0 : store.setAutoFocusOnShow(true); }); const onFocusProp = props.onFocus; const onFocus = _L5A2ID7Scjs.useEvent.call(void 0, (event) => { onFocusProp == null ? void 0 : onFocusProp(event); if (event.defaultPrevented) return; setVisible(true); }); const { style } = _Y35J4OLVcjs.useVisuallyHidden.call(void 0, ); if (!visible) { props = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {}, props), { style: _7EQBAZ46cjs.__spreadValues.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {}, style), props.style) }); } const children = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { display: "block", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, viewBox: "0 0 16 16", height: "1em", width: "1em", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "polyline", { points: "4,6 8,10 12,6" }) } ); props = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, { children }, props), { ref: _L5A2ID7Scjs.useMergeRefs.call(void 0, store.setDisclosureElement, props.ref), onClick, onFocus }); props = _JVADL66Kcjs.useDialogDisclosure.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, { store }, props)); return props; }); var HovercardDisclosure = _6TI3NXX6cjs.forwardRef.call(void 0, function HovercardDisclosure2(props) { const htmlProps = useHovercardDisclosure(props); return _6TI3NXX6cjs.createElement.call(void 0, TagName, htmlProps); }); exports.HovercardDisclosure = HovercardDisclosure; exports.useHovercardDisclosure = useHovercardDisclosure;