@atlaskit/editor-plugin-panel
Version:
Panel plugin for @atlaskit/editor-core.
43 lines • 1.55 kB
JavaScript
import React, { useCallback } from 'react';
import { useIntl } from 'react-intl';
import { PanelType } from '@atlaskit/adf-schema/panel';
import { QuickInsertMenuItem } from '@atlaskit/editor-common/quick-insert/menu-item';
import { createPanelAction } from '../../pm-plugins/commands/create-panel-action';
var getPanelAttributes = function getPanelAttributes(panelType) {
return panelType === PanelType.CUSTOM ? {
panelType: panelType,
panelIcon: ':rainbow:',
panelIconId: '1f308',
panelIconText: '🌈',
// Custom panel color is stored in ADF, not applied as UI styling.
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
panelColor: '#E6FCFF'
} : {
panelType: panelType
};
};
export var PanelQuickInsertMenuItem = function PanelQuickInsertMenuItem(_ref) {
var api = _ref.api,
Icon = _ref.icon,
panelType = _ref.panelType,
title = _ref.title;
var _useIntl = useIntl(),
formatMessage = _useIntl.formatMessage;
var onSelect = useCallback(function (_ref2) {
var editorView = _ref2.editorView,
insert = _ref2.insert,
source = _ref2.source;
return createPanelAction({
api: api,
attributes: getPanelAttributes(panelType),
inputMethod: source,
state: editorView.state,
typeAheadInsert: insert
});
}, [api, panelType]);
return /*#__PURE__*/React.createElement(QuickInsertMenuItem, {
iconBefore: /*#__PURE__*/React.createElement(Icon, null),
onSelect: onSelect,
title: formatMessage(title)
});
};