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

Block library for the WordPress editor.

import _extends from "@babel/runtime/helpers/esm/extends";
import { createElement, Fragment } from "@wordpress/element";

/**
 * External dependencies
 */
import classnames from 'classnames';
/**
 * WordPress dependencies
 */

import { AlignmentControl, BlockControls, InspectorControls, useBlockProps, PlainText } from '@wordpress/block-editor';
import { ToggleControl, TextControl, PanelBody } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import { useEntityProp } from '@wordpress/core-data';
/**
 * Internal dependencies
 */

import HeadingLevelDropdown from '../heading/heading-level-dropdown';
import { useCanEditEntity } from '../utils/hooks';
export default 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 = useCanEditEntity('postType', postType, postId);
  const [rawTitle = '', setTitle, fullTitle] = useEntityProp('postType', postType, 'title', postId);
  const [link] = useEntityProp('postType', postType, 'link', postId);
  const blockProps = useBlockProps({
    className: classnames({
      [`has-text-align-${textAlign}`]: textAlign
    })
  });
  let titleElement = createElement(TagName, blockProps, __('Post Title'));

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

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

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