@wordpress/block-library/build/heading/edit.native.js

"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 _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

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

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

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

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

var _headingToolbar = _interopRequireDefault(require("./heading-toolbar"));

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

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

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

var _blocks = require("@wordpress/blocks");

require("./editor.scss");

/**
 * Internal dependencies
 */

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
var minHeight = 24;

var HeadingEdit =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(HeadingEdit, _Component);

  function HeadingEdit(props) {
    var _this;

    (0, _classCallCheck2.default)(this, HeadingEdit);
    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HeadingEdit).call(this, props));
    _this.state = {
      aztecHeight: 0
    };
    return _this;
  }

  (0, _createClass2.default)(HeadingEdit, [{
    key: "render",
    value: function render() {
      var _this2 = this;

      var _this$props = this.props,
          attributes = _this$props.attributes,
          setAttributes = _this$props.setAttributes,
          mergeBlocks = _this$props.mergeBlocks,
          insertBlocksAfter = _this$props.insertBlocksAfter;
      var level = attributes.level,
          placeholder = attributes.placeholder,
          content = attributes.content;
      var tagName = 'h' + level;
      return (0, _element.createElement)(_reactNative.View, null, (0, _element.createElement)(_blockEditor.BlockControls, null, (0, _element.createElement)(_headingToolbar.default, {
        minLevel: 2,
        maxLevel: 5,
        selectedLevel: level,
        onChange: function onChange(newLevel) {
          return setAttributes({
            level: newLevel
          });
        }
      })), (0, _element.createElement)(_blockEditor.RichText, {
        tagName: tagName,
        value: content,
        isSelected: this.props.isSelected,
        onFocus: this.props.onFocus // always assign onFocus as a props
        ,
        onBlur: this.props.onBlur // always assign onBlur as a props
        ,
        onCaretVerticalPositionChange: this.props.onCaretVerticalPositionChange,
        style: {
          minHeight: Math.max(minHeight, this.state.aztecHeight)
        },
        onChange: function onChange(value) {
          return setAttributes({
            content: value
          });
        },
        onMerge: mergeBlocks,
        onSplit: insertBlocksAfter ? function (before, after) {
          setAttributes({
            content: before
          });

          for (var _len = arguments.length, blocks = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
            blocks[_key - 2] = arguments[_key];
          }

          insertBlocksAfter([].concat(blocks, [(0, _blocks.createBlock)('core/paragraph', {
            content: after
          })]));
        } : undefined,
        onContentSizeChange: function onContentSizeChange(event) {
          _this2.setState({
            aztecHeight: event.aztecHeight
          });
        },
        placeholder: placeholder || (0, _i18n.__)('Write heading…')
      }));
    }
  }]);
  return HeadingEdit;
}(_element.Component);

var _default = HeadingEdit;
exports.default = _default;
//# sourceMappingURL=edit.native.js.map