@wordpress/block-library/build/query/edit/index.js

Block library for the WordPress 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 _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

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

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

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

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

var _queryContent = _interopRequireDefault(require("./query-content"));

var _queryPlaceholder = _interopRequireDefault(require("./query-placeholder"));

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

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
const QueryEdit = props => {
  const {
    clientId,
    attributes
  } = props;
  const [isPatternSelectionModalOpen, setIsPatternSelectionModalOpen] = (0, _element.useState)(false);
  const hasInnerBlocks = (0, _data.useSelect)(select => !!select(_blockEditor.store).getBlocks(clientId).length, [clientId]);
  const Component = hasInnerBlocks ? _queryContent.default : _queryPlaceholder.default;
  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(Component, (0, _extends2.default)({}, props, {
    openPatternSelectionModal: () => setIsPatternSelectionModalOpen(true)
  })), isPatternSelectionModalOpen && (0, _element.createElement)(PatternSelectionModal, {
    clientId: clientId,
    attributes: attributes,
    setIsPatternSelectionModalOpen: setIsPatternSelectionModalOpen
  }));
};

function PatternSelectionModal(_ref) {
  let {
    clientId,
    attributes,
    setIsPatternSelectionModalOpen
  } = _ref;
  const {
    replaceBlock,
    selectBlock
  } = (0, _data.useDispatch)(_blockEditor.store);

  const onBlockPatternSelect = blocks => {
    const {
      newBlocks,
      queryClientIds
    } = (0, _utils.getTransformedBlocksFromPattern)(blocks, attributes);
    replaceBlock(clientId, newBlocks);

    if (queryClientIds[0]) {
      selectBlock(queryClientIds[0]);
    }
  }; // When we preview Query Loop blocks we should prefer the current
  // block's postType, which is passed through block context.


  const blockPreviewContext = (0, _element.useMemo)(() => ({
    previewPostType: attributes.query.postType
  }), [attributes.query.postType]);
  const blockNameForPatterns = (0, _utils.useBlockNameForPatterns)(clientId, attributes);
  return (0, _element.createElement)(_components.Modal, {
    className: "block-editor-query-pattern__selection-modal",
    title: (0, _i18n.__)('Choose a pattern'),
    closeLabel: (0, _i18n.__)('Cancel'),
    onRequestClose: () => setIsPatternSelectionModalOpen(false)
  }, (0, _element.createElement)(_blockEditor.BlockContextProvider, {
    value: blockPreviewContext
  }, (0, _element.createElement)(_blockEditor.__experimentalBlockPatternSetup, {
    blockName: blockNameForPatterns,
    clientId: clientId,
    onBlockPatternSelect: onBlockPatternSelect
  })));
}

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