"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// packages/block-editor/src/components/block-popover/cover.js
var cover_exports = {};
__export(cover_exports, {
  default: () => cover_default
});
module.exports = __toCommonJS(cover_exports);
var import_element = require("@wordpress/element");
var import_use_block_refs = require("../block-list/use-block-props/use-block-refs");
var import__ = require(".");
var import_jsx_runtime = require("react/jsx-runtime");
function BlockPopoverCover({
  clientId,
  bottomClientId,
  children,
  shift = false,
  additionalStyles,
  ...props
}, ref) {
  bottomClientId ??= clientId;
  const selectedElement = (0, import_use_block_refs.useBlockElement)(clientId);
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
    import__.PrivateBlockPopover,
    {
      ref,
      clientId,
      bottomClientId,
      shift,
      ...props,
      children: selectedElement && clientId === bottomClientId ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
        CoverContainer,
        {
          selectedElement,
          additionalStyles,
          children
        }
      ) : children
    }
  );
}
function CoverContainer({
  selectedElement,
  additionalStyles = {},
  children
}) {
  const [width, setWidth] = (0, import_element.useState)(selectedElement.offsetWidth);
  const [height, setHeight] = (0, import_element.useState)(selectedElement.offsetHeight);
  (0, import_element.useEffect)(() => {
    const observer = new window.ResizeObserver(() => {
      setWidth(selectedElement.offsetWidth);
      setHeight(selectedElement.offsetHeight);
    });
    observer.observe(selectedElement, { box: "border-box" });
    return () => observer.disconnect();
  }, [selectedElement]);
  const style = (0, import_element.useMemo)(() => {
    return {
      position: "absolute",
      width,
      height,
      ...additionalStyles
    };
  }, [width, height, additionalStyles]);
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style, children });
}
var cover_default = (0, import_element.forwardRef)(BlockPopoverCover);
//# sourceMappingURL=cover.js.map
