@wordpress/block-library/build-module/template-part/edit/title-modal.js

Block library for the WordPress editor.

import { createElement } from "@wordpress/element";

/**
 * WordPress dependencies
 */
import { useState } from '@wordpress/element';
import { __, sprintf } from '@wordpress/i18n';
import { TextControl, Flex, FlexItem, Button, Modal } from '@wordpress/components';
export default function TitleModal(_ref) {
  let {
    areaLabel,
    onClose,
    onSubmit
  } = _ref;
  // Restructure onCreate to set the blocks on local state.
  // Add modal to confirm title and trigger onCreate.
  const [title, setTitle] = useState(__('Untitled Template Part'));

  const submitForCreation = event => {
    event.preventDefault();
    onSubmit(title);
  };

  return createElement(Modal, {
    title: sprintf( // Translators: %s as template part area title ("Header", "Footer", etc.).
    __('Name and create your new %s'), areaLabel.toLowerCase()),
    closeLabel: __('Cancel'),
    overlayClassName: "wp-block-template-part__placeholder-create-new__title-form",
    onRequestClose: onClose
  }, createElement("form", {
    onSubmit: submitForCreation
  }, createElement(TextControl, {
    label: __('Name'),
    value: title,
    onChange: setTitle
  }), createElement(Flex, {
    className: "wp-block-template-part__placeholder-create-new__title-form-actions",
    justify: "flex-end"
  }, createElement(FlexItem, null, createElement(Button, {
    variant: "primary",
    type: "submit",
    disabled: !title.length,
    "aria-disabled": !title.length
  }, __('Create'))))));
}
//# sourceMappingURL=title-modal.js.map