@wordpress/editor/build/components/post-visibility/index.js

Enhanced block editor for WordPress posts.

"use strict";

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

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

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

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

var _compose = require("@wordpress/compose");

var _data = require("@wordpress/data");

var _utils = require("./utils");

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
class PostVisibility extends _element.Component {
  constructor(props) {
    super(...arguments);
    this.setPublic = this.setPublic.bind(this);
    this.setPrivate = this.setPrivate.bind(this);
    this.setPasswordProtected = this.setPasswordProtected.bind(this);
    this.updatePassword = this.updatePassword.bind(this);
    this.state = {
      hasPassword: !!props.password
    };
  }

  setPublic() {
    const {
      visibility,
      onUpdateVisibility,
      status
    } = this.props;
    onUpdateVisibility(visibility === 'private' ? 'draft' : status);
    this.setState({
      hasPassword: false
    });
  }

  setPrivate() {
    if ( // eslint-disable-next-line no-alert
    !window.confirm((0, _i18n.__)('Would you like to privately publish this post now?'))) {
      return;
    }

    const {
      onUpdateVisibility,
      onSave
    } = this.props;
    onUpdateVisibility('private');
    this.setState({
      hasPassword: false
    });
    onSave();
  }

  setPasswordProtected() {
    const {
      visibility,
      onUpdateVisibility,
      status,
      password
    } = this.props;
    onUpdateVisibility(visibility === 'private' ? 'draft' : status, password || '');
    this.setState({
      hasPassword: true
    });
  }

  updatePassword(event) {
    const {
      status,
      onUpdateVisibility
    } = this.props;
    onUpdateVisibility(status, event.target.value);
  }

  render() {
    const {
      visibility,
      password,
      instanceId
    } = this.props;
    const visibilityHandlers = {
      public: {
        onSelect: this.setPublic,
        checked: visibility === 'public' && !this.state.hasPassword
      },
      private: {
        onSelect: this.setPrivate,
        checked: visibility === 'private'
      },
      password: {
        onSelect: this.setPasswordProtected,
        checked: this.state.hasPassword
      }
    };
    return [(0, _element.createElement)("fieldset", {
      key: "visibility-selector",
      className: "editor-post-visibility__dialog-fieldset"
    }, (0, _element.createElement)("legend", {
      className: "editor-post-visibility__dialog-legend"
    }, (0, _i18n.__)('Post Visibility')), _utils.visibilityOptions.map(({
      value,
      label,
      info
    }) => (0, _element.createElement)("div", {
      key: value,
      className: "editor-post-visibility__choice"
    }, (0, _element.createElement)("input", {
      type: "radio",
      name: `editor-post-visibility__setting-${instanceId}`,
      value: value,
      onChange: visibilityHandlers[value].onSelect,
      checked: visibilityHandlers[value].checked,
      id: `editor-post-${value}-${instanceId}`,
      "aria-describedby": `editor-post-${value}-${instanceId}-description`,
      className: "editor-post-visibility__dialog-radio"
    }), (0, _element.createElement)("label", {
      htmlFor: `editor-post-${value}-${instanceId}`,
      className: "editor-post-visibility__dialog-label"
    }, label), (0, _element.createElement)("p", {
      id: `editor-post-${value}-${instanceId}-description`,
      className: "editor-post-visibility__dialog-info"
    }, info)))), this.state.hasPassword && (0, _element.createElement)("div", {
      className: "editor-post-visibility__dialog-password",
      key: "password-selector"
    }, (0, _element.createElement)(_components.VisuallyHidden, {
      as: "label",
      htmlFor: `editor-post-visibility__dialog-password-input-${instanceId}`
    }, (0, _i18n.__)('Create password')), (0, _element.createElement)("input", {
      className: "editor-post-visibility__dialog-password-input",
      id: `editor-post-visibility__dialog-password-input-${instanceId}`,
      type: "text",
      onChange: this.updatePassword,
      value: password,
      placeholder: (0, _i18n.__)('Use a secure password')
    }))];
  }

}

exports.PostVisibility = PostVisibility;

var _default = (0, _compose.compose)([(0, _data.withSelect)(select => {
  const {
    getEditedPostAttribute,
    getEditedPostVisibility
  } = select('core/editor');
  return {
    status: getEditedPostAttribute('status'),
    visibility: getEditedPostVisibility(),
    password: getEditedPostAttribute('password')
  };
}), (0, _data.withDispatch)(dispatch => {
  const {
    savePost,
    editPost
  } = dispatch('core/editor');
  return {
    onSave: savePost,

    onUpdateVisibility(status, password = '') {
      editPost({
        status,
        password
      });
    }

  };
}), _compose.withInstanceId])(PostVisibility);

exports.default = _default;
//# sourceMappingURL=index.js.map