@wordpress/block-library/build/post-title/edit.js

Block library for the WordPress editor.

"use strict";

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

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

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

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

var _classnames = _interopRequireDefault(require("classnames"));

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

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

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

var _coreData = require("@wordpress/core-data");

var _headingLevelDropdown = _interopRequireDefault(require("../heading/heading-level-dropdown"));

var _hooks = require("../utils/hooks");

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
function PostTitleEdit(_ref) {
  let {
    attributes: {
      level,
      textAlign,
      isLink,
      rel,
      linkTarget
    },
    setAttributes,
    context: {
      postType,
      postId,
      queryId
    }
  } = _ref;
  const TagName = 0 === level ? 'p' : 'h' + level;
  const isDescendentOfQueryLoop = Number.isFinite(queryId);
  const userCanEdit = (0, _hooks.useCanEditEntity)('postType', postType, postId);
  const [rawTitle = '', setTitle, fullTitle] = (0, _coreData.useEntityProp)('postType', postType, 'title', postId);
  const [link] = (0, _coreData.useEntityProp)('postType', postType, 'link', postId);
  const blockProps = (0, _blockEditor.useBlockProps)({
    className: (0, _classnames.default)({
      [`has-text-align-${textAlign}`]: textAlign
    })
  });
  let titleElement = (0, _element.createElement)(TagName, blockProps, (0, _i18n.__)('Post Title'));

  if (postType && postId) {
    titleElement = userCanEdit && !isDescendentOfQueryLoop ? (0, _element.createElement)(_blockEditor.PlainText, (0, _extends2.default)({
      tagName: TagName,
      placeholder: (0, _i18n.__)('No Title'),
      value: rawTitle,
      onChange: setTitle,
      __experimentalVersion: 2
    }, blockProps)) : (0, _element.createElement)(TagName, (0, _extends2.default)({}, blockProps, {
      dangerouslySetInnerHTML: {
        __html: fullTitle === null || fullTitle === void 0 ? void 0 : fullTitle.rendered
      }
    }));
  }

  if (isLink && postType && postId) {
    titleElement = userCanEdit && !isDescendentOfQueryLoop ? (0, _element.createElement)(TagName, blockProps, (0, _element.createElement)(_blockEditor.PlainText, {
      tagName: "a",
      href: link,
      target: linkTarget,
      rel: rel,
      placeholder: !rawTitle.length ? (0, _i18n.__)('No Title') : null,
      value: rawTitle,
      onChange: setTitle,
      __experimentalVersion: 2
    })) : (0, _element.createElement)(TagName, blockProps, (0, _element.createElement)("a", {
      href: link,
      target: linkTarget,
      rel: rel,
      onClick: event => event.preventDefault(),
      dangerouslySetInnerHTML: {
        __html: fullTitle === null || fullTitle === void 0 ? void 0 : fullTitle.rendered
      }
    }));
  }

  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_blockEditor.BlockControls, {
    group: "block"
  }, (0, _element.createElement)(_headingLevelDropdown.default, {
    selectedLevel: level,
    onChange: newLevel => setAttributes({
      level: newLevel
    })
  }), (0, _element.createElement)(_blockEditor.AlignmentControl, {
    value: textAlign,
    onChange: nextAlign => {
      setAttributes({
        textAlign: nextAlign
      });
    }
  })), (0, _element.createElement)(_blockEditor.InspectorControls, null, (0, _element.createElement)(_components.PanelBody, {
    title: (0, _i18n.__)('Link settings')
  }, (0, _element.createElement)(_components.ToggleControl, {
    label: (0, _i18n.__)('Make title a link'),
    onChange: () => setAttributes({
      isLink: !isLink
    }),
    checked: isLink
  }), isLink && (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.ToggleControl, {
    label: (0, _i18n.__)('Open in new tab'),
    onChange: value => setAttributes({
      linkTarget: value ? '_blank' : '_self'
    }),
    checked: linkTarget === '_blank'
  }), (0, _element.createElement)(_components.TextControl, {
    label: (0, _i18n.__)('Link rel'),
    value: rel,
    onChange: newRel => setAttributes({
      rel: newRel
    })
  })))), titleElement);
}
//# sourceMappingURL=edit.js.map