@wordpress/editor
Version:
Enhanced block editor for WordPress posts.
90 lines (87 loc) • 2.96 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = EditTemplateBlocksNotification;
var _data = require("@wordpress/data");
var _coreData = require("@wordpress/core-data");
var _element = require("@wordpress/element");
var _i18n = require("@wordpress/i18n");
var _components = require("@wordpress/components");
var _store = require("../../store");
var _jsxRuntime = require("react/jsx-runtime");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Component that:
*
* - Displays a 'Edit your template to edit this block' notification when the
* user is focusing on editing page content and clicks on a disabled template
* block.
* - Displays a 'Edit your template to edit this block' dialog when the user
* is focusing on editing page conetnt and double clicks on a disabled
* template block.
*
* @param {Object} props
* @param {import('react').RefObject<HTMLElement>} props.contentRef Ref to the block
* editor iframe canvas.
*/function EditTemplateBlocksNotification({
contentRef
}) {
const {
onNavigateToEntityRecord,
templateId
} = (0, _data.useSelect)(select => {
const {
getEditorSettings,
getCurrentTemplateId
} = select(_store.store);
return {
onNavigateToEntityRecord: getEditorSettings().onNavigateToEntityRecord,
templateId: getCurrentTemplateId()
};
}, []);
const canEditTemplate = (0, _data.useSelect)(select => !!select(_coreData.store).canUser('create', {
kind: 'postType',
name: 'wp_template'
}), []);
const [isDialogOpen, setIsDialogOpen] = (0, _element.useState)(false);
(0, _element.useEffect)(() => {
const handleDblClick = event => {
if (!canEditTemplate) {
return;
}
if (!event.target.classList.contains('is-root-container') || event.target.dataset?.type === 'core/template-part') {
return;
}
setIsDialogOpen(true);
};
const canvas = contentRef.current;
canvas?.addEventListener('dblclick', handleDblClick);
return () => {
canvas?.removeEventListener('dblclick', handleDblClick);
};
}, [contentRef, canEditTemplate]);
if (!canEditTemplate) {
return null;
}
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalConfirmDialog, {
isOpen: isDialogOpen,
confirmButtonText: (0, _i18n.__)('Edit template'),
onConfirm: () => {
setIsDialogOpen(false);
onNavigateToEntityRecord({
postId: templateId,
postType: 'wp_template'
});
},
onCancel: () => setIsDialogOpen(false),
size: "medium",
children: (0, _i18n.__)('You’ve tried to select a block that is part of a template, which may be used on other posts and pages. Would you like to edit the template?')
});
}
//# sourceMappingURL=edit-template-blocks-notification.js.map