UNPKG

@atlaskit/editor-plugin-help-dialog

Version:

Help Dialog plugin for @atlaskit/editor-core

57 lines (56 loc) 2.15 kB
/** * @jsxRuntime classic * @jsx jsx */ import { useCallback, useEffect } from 'react'; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766 import { jsx } from '@emotion/react'; import { injectIntl } from 'react-intl-next'; import { useSharedPluginState } from '@atlaskit/editor-common/hooks'; import AkModalDialog, { ModalTransition } from '@atlaskit/modal-dialog'; import { closeHelpCommand } from '../pm-plugins/commands'; import { getSupportedFormatting } from './formatting'; import Modal from './Modal'; const HelpDialog = ({ pluginInjectionApi, editorView, quickInsertEnabled, intl }) => { const { helpDialogState } = useSharedPluginState(pluginInjectionApi, ['helpDialog']); const closeDialog = useCallback(() => { const { state: { tr }, dispatch } = editorView; closeHelpCommand(tr, dispatch); }, [editorView]); const handleEsc = useCallback(e => { if (e.key === 'Escape' && helpDialogState !== null && helpDialogState !== void 0 && helpDialogState.isVisible) { closeDialog(); } }, [closeDialog, helpDialogState === null || helpDialogState === void 0 ? void 0 : helpDialogState.isVisible]); useEffect(() => { // Ignored via go/ees005 // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners document.addEventListener('keydown', handleEsc); return () => { // Ignored via go/ees005 // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners document.removeEventListener('keydown', handleEsc); }; }, [handleEsc]); const formatting = getSupportedFormatting(editorView.state.schema, intl, helpDialogState === null || helpDialogState === void 0 ? void 0 : helpDialogState.imageEnabled, quickInsertEnabled); return jsx(ModalTransition, null, helpDialogState !== null && helpDialogState !== void 0 && helpDialogState.isVisible ? jsx(AkModalDialog, { width: "large", onClose: closeDialog, testId: "help-modal-dialog" }, jsx(Modal, { formatting: formatting })) : null); }; export default injectIntl(HelpDialog);