@wordpress/block-editor/build/components/url-input/button.js

Generic block editor.

"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 _i18n = require("@wordpress/i18n");

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

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

var _ = _interopRequireDefault(require("./"));

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
class URLInputButton extends _element.Component {
  constructor() {
    super(...arguments);
    this.toggle = this.toggle.bind(this);
    this.submitLink = this.submitLink.bind(this);
    this.state = {
      expanded: false
    };
  }

  toggle() {
    this.setState({
      expanded: !this.state.expanded
    });
  }

  submitLink(event) {
    event.preventDefault();
    this.toggle();
  }

  render() {
    const {
      url,
      onChange
    } = this.props;
    const {
      expanded
    } = this.state;
    const buttonLabel = url ? (0, _i18n.__)('Edit link') : (0, _i18n.__)('Insert link');
    return (0, _element.createElement)("div", {
      className: "block-editor-url-input__button"
    }, (0, _element.createElement)(_components.Button, {
      icon: _icons.link,
      label: buttonLabel,
      onClick: this.toggle,
      className: "components-toolbar__control",
      isPressed: !!url
    }), expanded && (0, _element.createElement)("form", {
      className: "block-editor-url-input__button-modal",
      onSubmit: this.submitLink
    }, (0, _element.createElement)("div", {
      className: "block-editor-url-input__button-modal-line"
    }, (0, _element.createElement)(_components.Button, {
      className: "block-editor-url-input__back",
      icon: _icons.arrowLeft,
      label: (0, _i18n.__)('Close'),
      onClick: this.toggle
    }), (0, _element.createElement)(_.default, {
      value: url || '',
      onChange: onChange
    }), (0, _element.createElement)(_components.Button, {
      icon: _icons.keyboardReturn,
      label: (0, _i18n.__)('Submit'),
      type: "submit"
    }))));
  }

}
/**
 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/url-input/README.md
 */


var _default = URLInputButton;
exports.default = _default;
//# sourceMappingURL=button.js.map