@ariakit/react-core/cjs/__chunks/DRXSFB5O.cjs

Ariakit React core

"use strict";Object.defineProperty(exports, "__esModule", {value: true});

var _WDV6EJ2Ucjs = require('./WDV6EJ2U.cjs');


var _VFNUZFXScjs = require('./VFNUZFXS.cjs');


var _RDNUVX4Vcjs = require('./RDNUVX4V.cjs');




var _SQLDFLTEcjs = require('./SQLDFLTE.cjs');





var _4KGS3DOWcjs = require('./4KGS3DOW.cjs');

// src/disclosure/disclosure-content.tsx
var _misc = require('@ariakit/core/utils/misc');
var _react = require('react');
var _reactdom = require('react-dom');
var _jsxruntime = require('react/jsx-runtime');
var TagName = "div";
function afterTimeout(timeoutMs, cb) {
  const timeoutId = setTimeout(cb, timeoutMs);
  return () => clearTimeout(timeoutId);
}
function afterPaint(cb) {
  let raf = requestAnimationFrame(() => {
    raf = requestAnimationFrame(cb);
  });
  return () => cancelAnimationFrame(raf);
}
function parseCSSTime(...times) {
  return times.join(", ").split(", ").reduce((longestTime, currentTimeString) => {
    const multiplier = currentTimeString.endsWith("ms") ? 1 : 1e3;
    const currentTime = Number.parseFloat(currentTimeString || "0s") * multiplier;
    if (currentTime > longestTime) return currentTime;
    return longestTime;
  }, 0);
}
function isHidden(mounted, hidden, alwaysVisible) {
  return !alwaysVisible && hidden !== false && (!mounted || !!hidden);
}
var useDisclosureContent = _SQLDFLTEcjs.createHook.call(void 0, function useDisclosureContent2({ store, alwaysVisible, ...props }) {
  const context = _VFNUZFXScjs.useDisclosureProviderContext.call(void 0, );
  store = store || context;
  _misc.invariant.call(void 0, 
    store,
    process.env.NODE_ENV !== "production" && "DisclosureContent must receive a `store` prop or be wrapped in a DisclosureProvider component."
  );
  const ref = _react.useRef.call(void 0, null);
  const id = _4KGS3DOWcjs.useId.call(void 0, props.id);
  const [transition, setTransition] = _react.useState.call(void 0, null);
  const open = _RDNUVX4Vcjs.useStoreState.call(void 0, store, "open");
  const mounted = _RDNUVX4Vcjs.useStoreState.call(void 0, store, "mounted");
  const animated = _RDNUVX4Vcjs.useStoreState.call(void 0, store, "animated");
  const contentElement = _RDNUVX4Vcjs.useStoreState.call(void 0, store, "contentElement");
  const otherElement = _RDNUVX4Vcjs.useStoreState.call(void 0, store.disclosure, "contentElement");
  const hasClosedRef = _react.useRef.call(void 0, false);
  _4KGS3DOWcjs.useSafeLayoutEffect.call(void 0, () => {
    if (!ref.current) return;
    store == null ? void 0 : store.setContentElement(ref.current);
  }, [store]);
  _4KGS3DOWcjs.useSafeLayoutEffect.call(void 0, () => {
    let previousAnimated;
    store == null ? void 0 : store.setState("animated", (animated2) => {
      previousAnimated = animated2;
      return true;
    });
    return () => {
      if (previousAnimated === void 0) return;
      store == null ? void 0 : store.setState("animated", previousAnimated);
    };
  }, [store]);
  _4KGS3DOWcjs.useSafeLayoutEffect.call(void 0, () => {
    if (!animated) {
      if (!open) {
        hasClosedRef.current = true;
        setTransition(null);
      } else if (hasClosedRef.current) {
        hasClosedRef.current = false;
        setTransition("enter");
      }
      return;
    }
    if (!(contentElement == null ? void 0 : contentElement.isConnected)) {
      setTransition(null);
      return;
    }
    return afterPaint(() => {
      setTransition(open ? "enter" : mounted ? "leave" : null);
    });
  }, [animated, contentElement, open, mounted]);
  _4KGS3DOWcjs.useSafeLayoutEffect.call(void 0, () => {
    if (!store) return;
    if (!animated) return;
    if (!transition) return;
    if (!contentElement) return;
    const stopAnimation = () => store == null ? void 0 : store.setState("animating", false);
    const stopAnimationSync = () => _reactdom.flushSync.call(void 0, stopAnimation);
    if (transition === "leave" && open) return;
    if (transition === "enter" && !open) return;
    if (typeof animated === "number") {
      const timeout2 = animated;
      return afterTimeout(timeout2, stopAnimationSync);
    }
    const {
      transitionDuration,
      animationDuration,
      transitionDelay,
      animationDelay
    } = getComputedStyle(contentElement);
    const {
      transitionDuration: transitionDuration2 = "0",
      animationDuration: animationDuration2 = "0",
      transitionDelay: transitionDelay2 = "0",
      animationDelay: animationDelay2 = "0"
    } = otherElement ? getComputedStyle(otherElement) : {};
    const delay = parseCSSTime(
      transitionDelay,
      animationDelay,
      transitionDelay2,
      animationDelay2
    );
    const duration = parseCSSTime(
      transitionDuration,
      animationDuration,
      transitionDuration2,
      animationDuration2
    );
    const timeout = delay + duration;
    if (!timeout) {
      if (transition === "enter") {
        store.setState("animated", false);
      }
      stopAnimation();
      return;
    }
    const frameRate = 1e3 / 60;
    const maxTimeout = Math.max(timeout - frameRate, 0);
    return afterTimeout(maxTimeout, stopAnimationSync);
  }, [store, animated, contentElement, otherElement, open, transition]);
  props = _4KGS3DOWcjs.useWrapElement.call(void 0, 
    props,
    (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WDV6EJ2Ucjs.DialogScopedContextProvider, { value: store, children: element }),
    [store]
  );
  const hidden = isHidden(mounted, props.hidden, alwaysVisible);
  const styleProp = props.style;
  const style = _react.useMemo.call(void 0, () => {
    if (hidden) {
      return { ...styleProp, display: "none" };
    }
    return styleProp;
  }, [hidden, styleProp]);
  props = {
    "data-open": open || void 0,
    "data-enter": transition === "enter" || void 0,
    "data-leave": transition === "leave" || void 0,
    hidden,
    ...props,
    id,
    ref: _4KGS3DOWcjs.useMergeRefs.call(void 0, id ? store.setContentElement : null, ref, props.ref),
    style
  };
  return _misc.removeUndefinedValues.call(void 0, props);
});
var DisclosureContentImpl = _SQLDFLTEcjs.forwardRef.call(void 0, function DisclosureContentImpl2(props) {
  const htmlProps = useDisclosureContent(props);
  return _SQLDFLTEcjs.createElement.call(void 0, TagName, htmlProps);
});
var DisclosureContent = _SQLDFLTEcjs.forwardRef.call(void 0, function DisclosureContent2({
  unmountOnHide,
  ...props
}) {
  const context = _VFNUZFXScjs.useDisclosureProviderContext.call(void 0, );
  const store = props.store || context;
  const mounted = _RDNUVX4Vcjs.useStoreState.call(void 0, 
    store,
    (state) => !unmountOnHide || (state == null ? void 0 : state.mounted)
  );
  if (mounted === false) return null;
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DisclosureContentImpl, { ...props });
});





exports.isHidden = isHidden; exports.useDisclosureContent = useDisclosureContent; exports.DisclosureContent = DisclosureContent;