import React, { useEffect, useState } from "react";
import { useToolbarBoundary } from "./../../toolbar-boundary.js";
const MaxWidthCalculationWrapper = ({
  setMaxWidth,
  children,
  otherWrapper,
  ...divProps
}) => {
  const containerElement = useToolbarBoundary();
  const [wrapper, setWrapper] = useState(null);
  useEffect(() => {
    const observableWrapper = otherWrapper !== void 0 ? otherWrapper : wrapper;
    if (!observableWrapper || !containerElement) {
      return;
    }
    setMaxWidth(containerElement.clientWidth);
    const resizeObserver = window?.ResizeObserver && new ResizeObserver(() => {
      setMaxWidth(containerElement.clientWidth);
    });
    resizeObserver?.observe(observableWrapper);
    return () => resizeObserver?.disconnect();
  }, [wrapper, otherWrapper, containerElement?.clientWidth]);
  if (otherWrapper === null) {
    return /* @__PURE__ */ React.createElement(React.Fragment, null, children);
  }
  if (otherWrapper) {
    return /* @__PURE__ */ React.createElement("div", { ...divProps }, children);
  }
  return /* @__PURE__ */ React.createElement("div", { ...divProps, ref: setWrapper }, children);
};
export {
  MaxWidthCalculationWrapper
};
//# sourceMappingURL=max-width-calculation-wrapper.js.map
