"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { createPortal } from "react-dom";
import { useT } from "@open-mercato/shared/lib/i18n/context";
import { IconButton } from "../primitives/icon-button.js";
import { Button } from "../primitives/button.js";
function RowActions({ items = [] }) {
  const t = useT();
  const [open, setOpen] = React.useState(false);
  const btnRef = React.useRef(null);
  const menuRef = React.useRef(null);
  const hoverTimeoutRef = React.useRef(null);
  const [anchorRect, setAnchorRect] = React.useState(null);
  const [direction, setDirection] = React.useState("down");
  const updatePosition = React.useCallback(() => {
    if (!btnRef.current) return;
    const rect = btnRef.current.getBoundingClientRect();
    setAnchorRect(rect);
    const spaceBelow = window.innerHeight - rect.bottom;
    const spaceAbove = rect.top;
    setDirection(spaceBelow < 180 && spaceAbove > spaceBelow ? "up" : "down");
  }, []);
  React.useEffect(() => {
    if (!open) return;
    updatePosition();
    function onDocClick(e) {
      const t2 = e.target;
      if (menuRef.current && !menuRef.current.contains(t2) && btnRef.current && !btnRef.current.contains(t2)) {
        setOpen(false);
      }
    }
    function onKey(e) {
      if (e.key === "Escape") {
        setOpen(false);
        btnRef.current?.focus();
      }
    }
    function onScrollOrResize() {
      updatePosition();
    }
    document.addEventListener("mousedown", onDocClick);
    document.addEventListener("keydown", onKey);
    window.addEventListener("scroll", onScrollOrResize, true);
    window.addEventListener("resize", onScrollOrResize);
    return () => {
      document.removeEventListener("mousedown", onDocClick);
      document.removeEventListener("keydown", onKey);
      window.removeEventListener("scroll", onScrollOrResize, true);
      window.removeEventListener("resize", onScrollOrResize);
    };
  }, [open, updatePosition]);
  React.useEffect(() => {
    return () => {
      if (hoverTimeoutRef.current) {
        clearTimeout(hoverTimeoutRef.current);
      }
    };
  }, []);
  if (items.length === 0) return null;
  const handlePointerEnter = (event) => {
    if (event.pointerType === "touch") return;
    if (hoverTimeoutRef.current) {
      clearTimeout(hoverTimeoutRef.current);
    }
    setOpen(true);
  };
  const handlePointerLeave = (event) => {
    if (event.pointerType === "touch") return;
    hoverTimeoutRef.current = setTimeout(() => {
      setOpen(false);
    }, 150);
  };
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: "relative inline-block text-left",
      onPointerEnter: handlePointerEnter,
      onPointerLeave: handlePointerLeave,
      children: [
        /* @__PURE__ */ jsxs(
          IconButton,
          {
            ref: btnRef,
            type: "button",
            variant: "ghost",
            "aria-haspopup": "menu",
            "aria-expanded": open,
            onClick: (e) => {
              e.stopPropagation();
              setOpen((v) => !v);
              requestAnimationFrame(updatePosition);
            },
            children: [
              /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u22EF" }),
              /* @__PURE__ */ jsx("span", { className: "sr-only", children: t("ui.rowActions.openActions", "Open actions") })
            ]
          }
        ),
        open && anchorRect && createPortal(
          /* @__PURE__ */ jsx(
            "div",
            {
              ref: menuRef,
              role: "menu",
              className: "fixed w-44 max-w-[calc(100vw-1rem)] rounded-md border bg-background p-1 shadow focus-visible:outline-none z-dropdown",
              style: {
                top: direction === "down" ? anchorRect.bottom + 8 : anchorRect.top - 8,
                left: Math.min(anchorRect.right, window.innerWidth - 8),
                transform: `translate(-100%, ${direction === "down" ? "0" : "-100%"})`
              },
              onPointerEnter: handlePointerEnter,
              onPointerLeave: handlePointerLeave,
              children: items.map((it, idx) => it.href ? /* @__PURE__ */ jsx(
                "a",
                {
                  href: it.href,
                  className: `block w-full text-left px-2 py-1 text-sm rounded hover:bg-accent ${it.destructive ? "text-red-600" : ""}`,
                  role: "menuitem",
                  onClick: (event) => {
                    event.stopPropagation();
                    setOpen(false);
                  },
                  children: it.label
                },
                idx
              ) : /* @__PURE__ */ jsx(
                Button,
                {
                  type: "button",
                  variant: "ghost",
                  size: "sm",
                  className: `w-full justify-start rounded-none font-normal ${it.destructive ? "text-red-600" : ""}`,
                  role: "menuitem",
                  onClick: (event) => {
                    event.stopPropagation();
                    setOpen(false);
                    it.onSelect?.();
                  },
                  children: it.label
                },
                idx
              ))
            }
          ),
          document.body
        )
      ]
    }
  );
}
export {
  RowActions
};
//# sourceMappingURL=RowActions.js.map
