"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = useEditorIframeProps;
var _clsx = _interopRequireDefault(require("clsx"));
var _data = require("@wordpress/data");
var _keycodes = require("@wordpress/keycodes");
var _element = require("@wordpress/element");
var _i18n = require("@wordpress/i18n");
var _editor = require("@wordpress/editor");
var _router = require("@wordpress/router");
var _url = require("@wordpress/url");
var _lockUnlock = require("../../lock-unlock");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const {
  useLocation,
  useHistory
} = (0, _lockUnlock.unlock)(_router.privateApis);
function useEditorIframeProps() {
  const {
    query,
    path
  } = useLocation();
  const history = useHistory();
  const {
    canvas = 'view'
  } = query;
  const currentPostIsTrashed = (0, _data.useSelect)(select => {
    return select(_editor.store).getCurrentPostAttribute('status') === 'trash';
  }, []);
  const [isFocused, setIsFocused] = (0, _element.useState)(false);
  (0, _element.useEffect)(() => {
    if (canvas === 'edit') {
      setIsFocused(false);
    }
  }, [canvas]);

  // In view mode, make the canvas iframe be perceived and behave as a button
  // to switch to edit mode, with a meaningful label and no title attribute.
  const viewModeIframeProps = {
    'aria-label': (0, _i18n.__)('Edit'),
    'aria-disabled': currentPostIsTrashed,
    title: null,
    role: 'button',
    tabIndex: 0,
    onFocus: () => setIsFocused(true),
    onBlur: () => setIsFocused(false),
    onKeyDown: event => {
      const {
        keyCode
      } = event;
      if ((keyCode === _keycodes.ENTER || keyCode === _keycodes.SPACE) && !currentPostIsTrashed) {
        event.preventDefault();
        history.navigate((0, _url.addQueryArgs)(path, {
          canvas: 'edit'
        }), {
          transition: 'canvas-mode-edit-transition'
        });
      }
    },
    onClick: () => history.navigate((0, _url.addQueryArgs)(path, {
      canvas: 'edit'
    }), {
      transition: 'canvas-mode-edit-transition'
    }),
    onClickCapture: event => {
      if (currentPostIsTrashed) {
        event.preventDefault();
        event.stopPropagation();
      }
    },
    readonly: true
  };
  return {
    className: (0, _clsx.default)('edit-site-visual-editor__editor-canvas', {
      'is-focused': isFocused && canvas === 'view'
    }),
    ...(canvas === 'view' ? viewModeIframeProps : {})
  };
}
//# sourceMappingURL=use-editor-iframe-props.js.map