@wordpress/edit-post/build/components/header/header-toolbar/index.native.js

Edit Post module for WordPress.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _element = require("@wordpress/element");

var _reactNative = require("react-native");

var _compose = require("@wordpress/compose");

var _data = require("@wordpress/data");

var _viewport = require("@wordpress/viewport");

var _i18n = require("@wordpress/i18n");

var _blockEditor = require("@wordpress/block-editor");

var _components = require("@wordpress/components");

var _icons = require("@wordpress/icons");

var _editor = require("@wordpress/editor");

var _style = _interopRequireDefault(require("./style.scss"));

var _store = require("../../../store");

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
function HeaderToolbar({
  hasRedo,
  hasUndo,
  redo,
  undo,
  showInserter,
  showKeyboardHideButton,
  getStylesFromColorScheme,
  onHideKeyboard,
  isRTL
}) {
  const scrollViewRef = (0, _element.useRef)(null);

  const scrollToStart = () => {
    scrollViewRef.current.scrollTo({
      x: 0
    });
  };

  const renderHistoryButtons = () => {
    const buttons = [
    /* TODO: replace with EditorHistoryRedo and EditorHistoryUndo */
    (0, _element.createElement)(_components.ToolbarButton, {
      key: "undoButton",
      title: (0, _i18n.__)('Undo'),
      icon: !isRTL ? _icons.undo : _icons.redo,
      isDisabled: !hasUndo,
      onClick: undo,
      extraProps: {
        hint: (0, _i18n.__)('Double tap to undo last change')
      }
    }), (0, _element.createElement)(_components.ToolbarButton, {
      key: "redoButton",
      title: (0, _i18n.__)('Redo'),
      icon: !isRTL ? _icons.redo : _icons.undo,
      isDisabled: !hasRedo,
      onClick: redo,
      extraProps: {
        hint: (0, _i18n.__)('Double tap to redo last change')
      }
    })];
    return isRTL ? buttons.reverse() : buttons;
  };

  return (0, _element.createElement)(_reactNative.View, {
    style: getStylesFromColorScheme(_style.default.container, _style.default.containerDark)
  }, (0, _element.createElement)(_reactNative.ScrollView, {
    ref: scrollViewRef,
    onContentSizeChange: scrollToStart,
    horizontal: true,
    showsHorizontalScrollIndicator: false,
    keyboardShouldPersistTaps: "always",
    alwaysBounceHorizontal: false,
    contentContainerStyle: _style.default.scrollableContent
  }, (0, _element.createElement)(_blockEditor.Inserter, {
    disabled: !showInserter
  }), renderHistoryButtons(), (0, _element.createElement)(_blockEditor.BlockToolbar, null)), showKeyboardHideButton && (0, _element.createElement)(_components.Toolbar, {
    passedStyle: _style.default.keyboardHideContainer
  }, (0, _element.createElement)(_components.ToolbarButton, {
    title: (0, _i18n.__)('Hide keyboard'),
    icon: _icons.keyboardClose,
    onClick: onHideKeyboard,
    extraProps: {
      hint: (0, _i18n.__)('Tap to hide the keyboard')
    }
  })));
}

var _default = (0, _compose.compose)([(0, _data.withSelect)(select => ({
  hasRedo: select(_editor.store).hasEditorRedo(),
  hasUndo: select(_editor.store).hasEditorUndo(),
  // This setting (richEditingEnabled) should not live in the block editor's setting.
  showInserter: select(_store.store).getEditorMode() === 'visual' && select(_editor.store).getEditorSettings().richEditingEnabled,
  isTextModeEnabled: select(_store.store).getEditorMode() === 'text',
  isRTL: select(_blockEditor.store).getSettings().isRTL
})), (0, _data.withDispatch)(dispatch => {
  const {
    clearSelectedBlock
  } = dispatch(_blockEditor.store);
  const {
    togglePostTitleSelection
  } = dispatch(_editor.store);
  return {
    redo: dispatch(_editor.store).redo,
    undo: dispatch(_editor.store).undo,

    onHideKeyboard() {
      clearSelectedBlock();
      togglePostTitleSelection(false);
    }

  };
}), (0, _viewport.withViewportMatch)({
  isLargeViewport: 'medium'
}), _compose.withPreferredColorScheme])(HeaderToolbar);

exports.default = _default;
//# sourceMappingURL=index.native.js.map