import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { cn } from "../../lib/utils.js";
import { HEADER_TABS_SLOT_WRAPPER_CLASS } from "../header-canonical/chrome-header.js";
const CHROME_UNBOUNDED_SLOT = "[&_[data-unbounded]]:my-[calc((var(--chrome-slot-h,var(--field-height-xs))-var(--field-height-sm))/2)]";
const SurfaceHeader = React.forwardRef(({ className, withTabs, tabsSlot, children, ...props }, ref) => {
  const hasTabs = tabsSlot != null || withTabs === true;
  if (tabsSlot != null) {
    return /* @__PURE__ */ jsxs(
      "div",
      {
        ref,
        className: cn("flex flex-col shrink-0", className),
        ...props,
        children: [
          /* @__PURE__ */ jsx(
            "div",
            {
              className: cn(
                "flex items-center gap-2",
                "px-[var(--layout-space-loose)] py-[var(--layout-space-tight)]",
                CHROME_UNBOUNDED_SLOT
              ),
              children
            }
          ),
          /* @__PURE__ */ jsx("div", { className: HEADER_TABS_SLOT_WRAPPER_CLASS, children: tabsSlot })
        ]
      }
    );
  }
  return /* @__PURE__ */ jsx(
    "div",
    {
      ref,
      className: cn(
        "flex items-center gap-2 shrink-0",
        !hasTabs && "border-b border-divider",
        "px-[var(--layout-space-loose)] py-[var(--layout-space-tight)]",
        CHROME_UNBOUNDED_SLOT,
        className
      ),
      ...props,
      children
    }
  );
});
SurfaceHeader.displayName = "SurfaceHeader";
const SurfaceBody = React.forwardRef(({ className, ...props }, ref) => (
  // 2026-05-04 viewport-aware scroll canonical:
  //   parent(PopoverContent / HoverCardContent / Dialog / Sheet)是 flex flex-col + max-h + overflow-hidden
  //   header / footer shrink-0;Body flex-1 min-h-0 overflow-y-auto → 視窗太小時 body 內 scroll
  //   非 flex-col parent 內 flex-1/min-h-0 no-op,backward compat
  /* @__PURE__ */ jsx(
    "div",
    {
      ref,
      className: cn(
        "flex-1 min-h-0 overflow-y-auto",
        "px-[var(--layout-space-loose)] py-[var(--layout-space-tight)]",
        className
      ),
      ...props
    }
  )
));
SurfaceBody.displayName = "SurfaceBody";
const SurfaceFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  "div",
  {
    ref,
    className: cn(
      "flex items-center justify-end gap-2 shrink-0 border-t border-divider",
      "px-[var(--layout-space-loose)] py-[var(--layout-space-tight)]",
      className
    ),
    ...props
  }
));
SurfaceFooter.displayName = "SurfaceFooter";
export {
  SurfaceBody,
  SurfaceFooter,
  SurfaceHeader
};
//# sourceMappingURL=overlay-surface.js.map
