UNPKG

@atlaskit/editor-plugin-panel

Version:

Panel plugin for @atlaskit/editor-core.

89 lines 3.2 kB
import React from 'react'; import { PanelType } from '@atlaskit/adf-schema/panel'; import { blockTypeMessages } from '@atlaskit/editor-common/messages'; import { createQuickInsertMatcher } from '@atlaskit/editor-common/quick-insert/create-quick-insert-matcher'; import { CUSTOM_PANEL_MENU_ITEM, ERROR_PANEL_MENU_ITEM, INFO_PANEL_MENU_ITEM, NOTE_PANEL_MENU_ITEM, STRUCTURE_SECTION, SUCCESS_PANEL_MENU_ITEM, WARNING_PANEL_MENU_ITEM } from '@atlaskit/editor-common/quick-insert/keys'; import { STRUCTURE_SECTION_RANK } from '@atlaskit/editor-common/quick-insert/rank'; import CheckCircleIcon from '@atlaskit/icon/core/check-circle'; import InformationCircleIcon from '@atlaskit/icon/core/information-circle'; import NoteIcon from '@atlaskit/icon/core/note'; import PencilIcon from '@atlaskit/icon-lab/core/pencil'; import StatusWorkflowCancelledIcon from '@atlaskit/icon-lab/core/status-workflow-cancelled'; import WarningOutlineIcon from '@atlaskit/icon-lab/core/warning-outline'; import { PanelQuickInsertMenuItem } from './PanelQuickInsertMenuItem'; const standardPanelItems = [{ description: blockTypeMessages.infoPanelDescription, icon: InformationCircleIcon, keywords: ['panel'], menuItem: INFO_PANEL_MENU_ITEM, panelType: PanelType.INFO, title: blockTypeMessages.infoPanel }, { description: blockTypeMessages.notePanelDescription, icon: NoteIcon, menuItem: NOTE_PANEL_MENU_ITEM, panelType: PanelType.NOTE, title: blockTypeMessages.notePanel }, { description: blockTypeMessages.successPanelDescription, icon: CheckCircleIcon, keywords: ['tip'], menuItem: SUCCESS_PANEL_MENU_ITEM, panelType: PanelType.SUCCESS, title: blockTypeMessages.successPanel }, { description: blockTypeMessages.warningPanelDescription, icon: WarningOutlineIcon, menuItem: WARNING_PANEL_MENU_ITEM, panelType: PanelType.WARNING, title: blockTypeMessages.warningPanel }, { description: blockTypeMessages.errorPanelDescription, icon: StatusWorkflowCancelledIcon, menuItem: ERROR_PANEL_MENU_ITEM, panelType: PanelType.ERROR, title: blockTypeMessages.errorPanel }]; const customPanelItem = { description: blockTypeMessages.customPanelDescription, icon: PencilIcon, menuItem: CUSTOM_PANEL_MENU_ITEM, panelType: PanelType.CUSTOM, title: blockTypeMessages.customPanel }; export const getPanelQuickInsertComponents = ({ api, allowCustomPanel, allowCustomPanelEdit }) => { const allPanelItems = [...standardPanelItems, ...(allowCustomPanel && allowCustomPanelEdit ? [customPanelItem] : [])]; return allPanelItems.map(({ description, icon, keywords, menuItem, panelType, title }) => ({ key: menuItem.key, type: menuItem.type, parents: [{ key: STRUCTURE_SECTION.key, type: STRUCTURE_SECTION.type, rank: STRUCTURE_SECTION_RANK[menuItem.key] }], match: createQuickInsertMatcher(({ formatMessage }) => ({ description: formatMessage(description), keywords, title: formatMessage(title) })), component: () => /*#__PURE__*/React.createElement(PanelQuickInsertMenuItem, { api: api, icon: icon, panelType: panelType, title: title }) })); };