import { jsx } from "react/jsx-runtime";
import { privateApis as routerPrivateApis } from "@wordpress/router";
import Editor from "../editor";
import { unlock } from "../../lock-unlock";
import SidebarNavigationScreenGlobalStyles from "../sidebar-navigation-screen-global-styles";
import GlobalStylesUIWrapper from "../sidebar-global-styles-wrapper";
import { StyleBookPreview } from "../style-book";
const { useLocation } = unlock(routerPrivateApis);
function MobileGlobalStylesUI() {
  const { query = {} } = useLocation();
  const { canvas } = query;
  if (canvas === "edit") {
    return /* @__PURE__ */ jsx(Editor, {});
  }
  return /* @__PURE__ */ jsx(GlobalStylesUIWrapper, {});
}
const stylesRoute = {
  name: "styles",
  path: "/styles",
  areas: {
    content: /* @__PURE__ */ jsx(GlobalStylesUIWrapper, {}),
    sidebar: /* @__PURE__ */ jsx(SidebarNavigationScreenGlobalStyles, { backPath: "/" }),
    preview({ query }) {
      const isStylebook = query.preview === "stylebook";
      return isStylebook ? /* @__PURE__ */ jsx(StyleBookPreview, {}) : /* @__PURE__ */ jsx(Editor, {});
    },
    mobile: /* @__PURE__ */ jsx(MobileGlobalStylesUI, {})
  },
  widths: {
    content: 380
  }
};
export {
  stylesRoute
};
//# sourceMappingURL=styles.js.map
