@atlaskit/editor-plugin-panel
Version:
Panel plugin for @atlaskit/editor-core.
43 lines • 1.59 kB
JavaScript
import React from 'react';
import { useIntl } from 'react-intl';
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
import { blockTypeMessages } from '@atlaskit/editor-common/messages';
import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
import InformationCircleIcon from '@atlaskit/icon/core/information-circle';
const NODE_NAME = 'panel';
const PanelBlockMenuItem = ({
api
}) => {
const {
formatMessage
} = useIntl();
const handleClick = event => {
const triggeredFrom = event.nativeEvent instanceof KeyboardEvent || event.nativeEvent.detail === 0 ? INPUT_METHOD.KEYBOARD : INPUT_METHOD.MOUSE;
const inputMethod = INPUT_METHOD.BLOCK_MENU;
api === null || api === void 0 ? void 0 : api.core.actions.execute(({
tr
}) => {
var _api$blockMenu;
const command = api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.transformNode(tr.doc.type.schema.nodes.panel, {
inputMethod,
triggeredFrom,
targetTypeName: NODE_NAME
});
return command ? command({
tr
}) : null;
});
};
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
onClick: handleClick,
elemBefore: /*#__PURE__*/React.createElement(InformationCircleIcon, {
label: "",
size: "small"
})
}, formatMessage(blockTypeMessages.panel));
};
export const createPanelBlockMenuItem = api => {
return () => /*#__PURE__*/React.createElement(PanelBlockMenuItem, {
api: api
});
};