@wordpress/block-library
Version:
Block library for the WordPress editor.
62 lines (61 loc) • 1.96 kB
JavaScript
// packages/block-library/src/tab-panel/add-tab-toolbar-control.js
import { __ } from "@wordpress/i18n";
import { createBlock } from "@wordpress/blocks";
import {
BlockControls,
store as blockEditorStore
} from "@wordpress/block-editor";
import { ToolbarGroup, ToolbarButton } from "@wordpress/components";
import { useDispatch, useSelect } from "@wordpress/data";
import { jsx } from "react/jsx-runtime";
function AddTabToolbarControl({ tabsClientId }) {
const { insertBlock } = useDispatch(blockEditorStore);
const { tabPanelsClientId, tabsListClientId } = useSelect(
(select) => {
if (!tabsClientId) {
return {
tabPanelsClientId: null,
tabsListClientId: null
};
}
const { getBlocks } = select(blockEditorStore);
const innerBlocks = getBlocks(tabsClientId);
const tabPanels = innerBlocks.find(
(block) => block.name === "core/tab-panels"
);
const tabList = innerBlocks.find(
(block) => block.name === "core/tab-list"
);
return {
tabPanelsClientId: tabPanels?.clientId || null,
tabsListClientId: tabList?.clientId || null
};
},
[tabsClientId]
);
const addTab = () => {
if (!tabPanelsClientId) {
return;
}
const newTabPanelBlock = createBlock("core/tab-panel", {
label: __("Tab")
});
insertBlock(newTabPanelBlock, void 0, tabPanelsClientId);
if (tabsListClientId) {
const newTabBlock = createBlock("core/tab", {});
insertBlock(newTabBlock, void 0, tabsListClientId);
}
};
return /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(ToolbarGroup, { children: /* @__PURE__ */ jsx(
ToolbarButton,
{
className: "components-toolbar__control",
onClick: addTab,
text: __("Add tab")
}
) }) });
}
export {
AddTabToolbarControl as default
};
//# sourceMappingURL=add-tab-toolbar-control.mjs.map