@wordpress/editor
Version:
Enhanced block editor for WordPress posts.
116 lines (112 loc) • 4.05 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = InserterSidebar;
var _data = require("@wordpress/data");
var _blockEditor = require("@wordpress/block-editor");
var _compose = require("@wordpress/compose");
var _element = require("@wordpress/element");
var _preferences = require("@wordpress/preferences");
var _keycodes = require("@wordpress/keycodes");
var _interface = require("@wordpress/interface");
var _lockUnlock = require("../../lock-unlock");
var _store = require("../../store");
var _jsxRuntime = require("react/jsx-runtime");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const {
PrivateInserterLibrary
} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
function InserterSidebar() {
const {
blockSectionRootClientId,
inserterSidebarToggleRef,
insertionPoint,
showMostUsedBlocks,
sidebarIsOpened
} = (0, _data.useSelect)(select => {
const {
getInserterSidebarToggleRef,
getInsertionPoint,
isPublishSidebarOpened
} = (0, _lockUnlock.unlock)(select(_store.store));
const {
getBlockRootClientId,
__unstableGetEditorMode,
getSectionRootClientId
} = (0, _lockUnlock.unlock)(select(_blockEditor.store));
const {
get
} = select(_preferences.store);
const {
getActiveComplementaryArea
} = select(_interface.store);
const getBlockSectionRootClientId = () => {
if (__unstableGetEditorMode() === 'zoom-out') {
const sectionRootClientId = getSectionRootClientId();
if (sectionRootClientId) {
return sectionRootClientId;
}
}
return getBlockRootClientId();
};
return {
inserterSidebarToggleRef: getInserterSidebarToggleRef(),
insertionPoint: getInsertionPoint(),
showMostUsedBlocks: get('core', 'mostUsedBlocks'),
blockSectionRootClientId: getBlockSectionRootClientId(),
sidebarIsOpened: !!(getActiveComplementaryArea('core') || isPublishSidebarOpened())
};
}, []);
const {
setIsInserterOpened
} = (0, _data.useDispatch)(_store.store);
const {
disableComplementaryArea
} = (0, _data.useDispatch)(_interface.store);
const isMobileViewport = (0, _compose.useViewportMatch)('medium', '<');
const libraryRef = (0, _element.useRef)();
// When closing the inserter, focus should return to the toggle button.
const closeInserterSidebar = (0, _element.useCallback)(() => {
setIsInserterOpened(false);
inserterSidebarToggleRef.current?.focus();
}, [inserterSidebarToggleRef, setIsInserterOpened]);
const closeOnEscape = (0, _element.useCallback)(event => {
if (event.keyCode === _keycodes.ESCAPE && !event.defaultPrevented) {
event.preventDefault();
closeInserterSidebar();
}
}, [closeInserterSidebar]);
const inserterContents = /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
className: "editor-inserter-sidebar__content",
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(PrivateInserterLibrary, {
showMostUsedBlocks: showMostUsedBlocks,
showInserterHelpPanel: true,
shouldFocusBlock: isMobileViewport,
rootClientId: blockSectionRootClientId !== null && blockSectionRootClientId !== void 0 ? blockSectionRootClientId : insertionPoint.rootClientId,
__experimentalInsertionIndex: insertionPoint.insertionIndex,
onSelect: insertionPoint.onSelect,
__experimentalInitialTab: insertionPoint.tab,
__experimentalInitialCategory: insertionPoint.category,
__experimentalFilterValue: insertionPoint.filterValue,
onPatternCategorySelection: sidebarIsOpened ? () => disableComplementaryArea('core') : undefined,
ref: libraryRef,
onClose: closeInserterSidebar
})
});
return (
/*#__PURE__*/
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
(0, _jsxRuntime.jsx)("div", {
onKeyDown: closeOnEscape,
className: "editor-inserter-sidebar",
children: inserterContents
})
);
}
//# sourceMappingURL=index.js.map