import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import * as PopoverPrimitive from "@radix-ui/react-popover";
import { X } from "lucide-react";
import { cn } from "../../lib/utils.js";
import { SurfaceBody, SurfaceFooter, SurfaceHeader } from "../../patterns/overlay-surface/overlay-surface.js";
import { Button } from "../Button/button.js";
import { OVERLAY_COLLISION_PADDING, OVERLAY_SIDE_OFFSET } from "../../tokens/elevation/overlay-geometry.js";
const Popover = PopoverPrimitive.Root;
const PopoverTrigger = PopoverPrimitive.Trigger;
const PopoverAnchor = PopoverPrimitive.Anchor;
const PopoverClose = PopoverPrimitive.Close;
const handlePopoverOpenAutoFocus = (e) => {
  e.preventDefault();
  const content = e.currentTarget;
  const firstBodyTarget = content.querySelector(
    "[data-popover-body] input:not([disabled]),[data-popover-body] textarea:not([disabled]),[data-popover-body] select:not([disabled]),[data-popover-body] button:not([disabled]):not([data-dismiss]),input:not([disabled]),textarea:not([disabled]),button:not([disabled]):not([data-dismiss])"
  );
  const firstFooterButton = content.querySelector(
    "[data-popover-footer] button:not([disabled]):not([data-dismiss])"
  );
  (firstBodyTarget ?? firstFooterButton ?? content).focus({ preventScroll: true });
};
const PopoverContent = React.forwardRef(({ className, align = "center", sideOffset = OVERLAY_SIDE_OFFSET, collisionPadding = OVERLAY_COLLISION_PADDING, onOpenAutoFocus, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
  PopoverPrimitive.Content,
  {
    ref,
    align,
    sideOffset,
    collisionPadding,
    "data-density": "md",
    onOpenAutoFocus: onOpenAutoFocus ?? handlePopoverOpenAutoFocus,
    className: cn(
      "z-50 w-72 rounded-lg border border-border bg-surface-raised text-foreground shadow-[var(--elevation-200)] outline-none",
      // 2026-05-04 viewport-aware max-h SSOT(從 ProfileCard 升 DS-wide):header/footer 永遠 in-viewport,body 壓縮 scroll
      // 2026-05-05 audit dim 35 補:加 `min-h-0` 完成 M25 chain invariant(flex item default min-h: auto 阻 shrink)
      "max-h-[var(--radix-popover-content-available-height,100vh)] flex flex-col overflow-hidden min-h-0",
      "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 motion-reduce:animate-none",
      "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
      "origin-[var(--radix-popover-content-transform-origin)]",
      className
    ),
    ...props
  }
) }));
PopoverContent.displayName = PopoverPrimitive.Content.displayName;
const PopoverHeader = React.forwardRef(
  ({ className, children, hideClose = false, ...props }, ref) => (
    // Popover lightweight chrome canonical(2026-05-04 重思 v2):
    //   覆寫 `--chrome-slot-h: 1.25rem` (20px) → unbounded button 佔位縮成 20,**匹配 PopoverTitle
    //   text-body line-height (14×1.5≈21,floor 20)**。Header 維持 padding-based 自然撐開:
    //   max(21 title, 20 slot) + py-tight(12*2) = 45 → 自然比 Dialog/Sheet 48 輕一級。
    //   Q10 穩定:title-only / title+close 都 = title + py 主導,slot 不 dominate。
    //   無 min-h / 無 py override — 修正前一版過度設計。
    /* @__PURE__ */ jsxs(
      SurfaceHeader,
      {
        ref,
        className: cn("justify-between [--chrome-slot-h:1.25rem]", className),
        ...props,
        children: [
          /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0", children }),
          !hideClose && // Dismiss X = native sm,SurfaceHeader 負 my trick 讓 layout 佔位 24 → 匹配 inner 24
          /* @__PURE__ */ jsx(PopoverPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { "data-dismiss": true, iconOnly: true, dismiss: true, size: "sm", startIcon: X, "aria-label": "關閉" }) })
        ]
      }
    )
  )
);
PopoverHeader.displayName = "PopoverHeader";
const PopoverBody = React.forwardRef(
  ({ ...props }, ref) => /* @__PURE__ */ jsx(SurfaceBody, { ref, "data-popover-body": true, ...props })
);
PopoverBody.displayName = "PopoverBody";
const PopoverFooter = React.forwardRef(
  ({ ...props }, ref) => /* @__PURE__ */ jsx(SurfaceFooter, { ref, "data-popover-footer": true, ...props })
);
PopoverFooter.displayName = "PopoverFooter";
const PopoverTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  "h2",
  {
    ref,
    className: cn("text-body font-medium truncate", className),
    ...props
  }
));
PopoverTitle.displayName = "PopoverTitle";
const popoverMeta = {
  component: "Popover",
  family: null,
  // non-family composite / overlay / layout
  variants: {},
  sizes: {},
  states: ["default"],
  // 浮層容器 primitive,無自己的 variant/size/disabled 互動 state(spec「為何無 Inspector」段;對齊 separator.tsx meta canonical)
  tokens: {
    bg: ["bg-surface-raised"],
    fg: ["text-foreground"],
    ring: []
  }
};
export {
  Popover,
  PopoverAnchor,
  PopoverBody,
  PopoverClose,
  PopoverContent,
  PopoverFooter,
  PopoverHeader,
  PopoverTitle,
  PopoverTrigger,
  popoverMeta
};
//# sourceMappingURL=popover.js.map
