UNPKG

@ariakit/react-core

Version:

Ariakit React core

134 lines (113 loc) 4.94 kB
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); var _6F6SPO63cjs = require('../__chunks/6F6SPO63.cjs'); var _EQD56WGFcjs = require('../__chunks/EQD56WGF.cjs'); var _BLY6TLX4cjs = require('../__chunks/BLY6TLX4.cjs'); require('../__chunks/HW4NUUUP.cjs'); require('../__chunks/ZVJRPAXY.cjs'); require('../__chunks/YDPERDKF.cjs'); require('../__chunks/KVXNVDJK.cjs'); require('../__chunks/F4ZQFU26.cjs'); require('../__chunks/DHAXJ5PA.cjs'); require('../__chunks/YUGKYIYY.cjs'); require('../__chunks/T3QB4FR3.cjs'); var _WULEED4Qcjs = require('../__chunks/WULEED4Q.cjs'); var _OZM4QA2Vcjs = require('../__chunks/OZM4QA2V.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 = _WULEED4Qcjs.createHook.call(void 0, function useHovercardDisclosure2(_a) { var _b = _a, { store } = _b, props = _7EQBAZ46cjs.__objRest.call(void 0, _b, ["store"]); const context = _6F6SPO63cjs.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 = _OZM4QA2Vcjs.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 = _OZM4QA2Vcjs.useEvent.call(void 0, (event) => { onFocusProp == null ? void 0 : onFocusProp(event); if (event.defaultPrevented) return; setVisible(true); }); const { style } = _EQD56WGFcjs.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: _OZM4QA2Vcjs.useMergeRefs.call(void 0, store.setDisclosureElement, props.ref), onClick, onFocus }); props = _BLY6TLX4cjs.useDialogDisclosure.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, { store }, props)); return props; }); var HovercardDisclosure = _WULEED4Qcjs.forwardRef.call(void 0, function HovercardDisclosure2(props) { const htmlProps = useHovercardDisclosure(props); return _WULEED4Qcjs.createElement.call(void 0, TagName, htmlProps); }); exports.HovercardDisclosure = HovercardDisclosure; exports.useHovercardDisclosure = useHovercardDisclosure;