@trail-ui/react/dist/chunk-D5VFAOBH.mjs

import {
  _Popover
} from "./chunk-6ZQ3XU24.mjs";

// src/popover/popover.tsx
import { clsx } from "@trail-ui/shared-utils";
import { popover } from "@trail-ui/theme";
import { PressResponder } from "@react-aria/interactions";
import { useMemo, useRef } from "react";
import { useOverlayTrigger } from "react-aria";
import {
  Dialog,
  DialogContext,
  OverlayArrow,
  OverlayTriggerStateContext,
  PopoverContext,
  Provider
} from "react-aria-components";
import { useOverlayTriggerState } from "react-stately";
import { jsx, jsxs } from "react/jsx-runtime";
function PopoverTrigger(props) {
  let state = useOverlayTriggerState(props);
  let buttonRef = useRef(null);
  let { triggerProps, overlayProps } = useOverlayTrigger({ type: "dialog" }, state, buttonRef);
  return /* @__PURE__ */ jsx(
    Provider,
    {
      "aria-label": "popover",
      values: [
        [OverlayTriggerStateContext, state],
        [DialogContext, overlayProps],
        [PopoverContext, { triggerRef: buttonRef }]
      ],
      children: /* @__PURE__ */ jsx(PressResponder, { ...triggerProps, ref: buttonRef, isPressed: state.isOpen, children: props.children })
    }
  );
}
function Popover(props) {
  const {
    children,
    showArrow = false,
    isNonModal = true,
    placement = "bottom",
    color,
    size,
    radius,
    shadow,
    classNames,
    className,
    isMenuPopover,
    ...otherProps
  } = props;
  const slots = useMemo(
    () => popover({ color, size, radius, shadow }),
    [color, size, radius, shadow]
  );
  const baseStyles = clsx(classNames == null ? void 0 : classNames.base, className);
  const arrowContent = useMemo(() => {
    if (!showArrow)
      return null;
    return /* @__PURE__ */ jsx(OverlayArrow, { className: slots.arrow({ class: classNames == null ? void 0 : classNames.arrow }), children: /* @__PURE__ */ jsx("svg", { width: 12, height: 12, viewBox: "0 0 12 12", children: /* @__PURE__ */ jsx("path", { d: "M0 0 L6 6 L12 0" }) }) });
  }, [classNames == null ? void 0 : classNames.arrow, showArrow, slots]);
  return /* @__PURE__ */ jsxs(
    _Popover,
    {
      isNonModal,
      placement,
      ...otherProps,
      className: slots.base({ class: baseStyles }),
      children: [
        arrowContent,
        !isMenuPopover ? /* @__PURE__ */ jsx(Dialog, { "aria-label": "dialog", className: slots.content({ class: classNames == null ? void 0 : classNames.content }), children }) : children
      ]
    }
  );
}

export {
  PopoverTrigger,
  Popover
};