// packages/block-editor/src/components/image-editor/index.js
import { ToolbarGroup, ToolbarItem } from "@wordpress/components";
import AspectRatioDropdown from "./aspect-ratio-dropdown";
import BlockControls from "../block-controls";
import ImageEditingProvider from "./context";
import Cropper from "./cropper";
import ZoomDropdown from "./zoom-dropdown";
import RotationButton from "./rotation-button";
import FormControls from "./form-controls";
import { jsx, jsxs } from "react/jsx-runtime";
function ImageEditor({
  id,
  url,
  width,
  height,
  naturalHeight,
  naturalWidth,
  onSaveImage,
  onFinishEditing,
  borderProps
}) {
  return /* @__PURE__ */ jsxs(
    ImageEditingProvider,
    {
      id,
      url,
      naturalWidth,
      naturalHeight,
      onSaveImage,
      onFinishEditing,
      children: [
        /* @__PURE__ */ jsx(
          Cropper,
          {
            borderProps,
            url,
            width,
            height,
            naturalHeight,
            naturalWidth
          }
        ),
        /* @__PURE__ */ jsxs(BlockControls, { children: [
          /* @__PURE__ */ jsxs(ToolbarGroup, { children: [
            /* @__PURE__ */ jsx(ZoomDropdown, {}),
            /* @__PURE__ */ jsx(ToolbarItem, { children: (toggleProps) => /* @__PURE__ */ jsx(AspectRatioDropdown, { toggleProps }) }),
            /* @__PURE__ */ jsx(RotationButton, {})
          ] }),
          /* @__PURE__ */ jsx(ToolbarGroup, { children: /* @__PURE__ */ jsx(FormControls, {}) })
        ] })
      ]
    }
  );
}
export {
  ImageEditor as default
};
//# sourceMappingURL=index.js.map
