/**
 * WordPress dependencies
 */
import { privateApis as routerPrivateApis } from '@wordpress/router';

/**
 * Internal dependencies
 */
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';
import { jsx as _jsx } from "react/jsx-runtime";
const {
  useLocation
} = unlock(routerPrivateApis);
function MobileGlobalStylesUI() {
  const {
    query = {}
  } = useLocation();
  const {
    canvas
  } = query;
  if (canvas === 'edit') {
    return /*#__PURE__*/_jsx(Editor, {});
  }
  return /*#__PURE__*/_jsx(GlobalStylesUIWrapper, {});
}
export 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
  }
};
//# sourceMappingURL=styles.js.map