import { jsx } from "react/jsx-runtime";
import { useEditor, useValue } from "@cmpd/editor";
import React, { useContext } from "react";
import { PORTRAIT_BREAKPOINTS } from "../constants.mjs";
const BreakpointContext = React.createContext(0);
function BreakPointProvider({
  forceMobile = false,
  children
}) {
  const editor = useEditor();
  const breakpoint = useValue(
    "breakpoint",
    () => {
      const { width } = editor.getViewportScreenBounds();
      const maxBreakpoint = forceMobile ? 3 : PORTRAIT_BREAKPOINTS.length - 1;
      for (let i = 0; i < maxBreakpoint; i++) {
        if (width > PORTRAIT_BREAKPOINTS[i] && width <= PORTRAIT_BREAKPOINTS[i + 1]) {
          return i;
        }
      }
      return maxBreakpoint;
    },
    [editor]
  );
  return /* @__PURE__ */ jsx(BreakpointContext.Provider, { value: breakpoint, children });
}
function useBreakpoint() {
  return useContext(BreakpointContext);
}
export {
  BreakPointProvider,
  useBreakpoint
};
//# sourceMappingURL=useBreakpoint.mjs.map
