@atlaskit/editor-plugin-help-dialog 1.1.0 → 1.1.2

package/dist/esm/ui/index.js

@@ -1,528 +1,17 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 /** @jsx jsx */
 import { useCallback, useEffect } from 'react';
 import { jsx } from '@emotion/react';
-import { FormattedMessage, injectIntl } from 'react-intl-next';
+import { injectIntl } from 'react-intl-next';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
-import { addInlineComment, addLink, alignCenter, alignLeft, alignRight, clearFormatting, decreaseMediaSize, focusTableResizer, increaseMediaSize, insertRule, navToEditorToolbar, navToFloatingToolbar, openHelp, pastePlainText, redo, setNormalText, toggleBlockQuote, toggleBold, toggleBulletList, toggleCode, toggleHeading1, toggleHeading2, toggleHeading3, toggleHeading4, toggleHeading5, toggleHeading6, toggleItalic, toggleOrderedList, toggleStrikethrough, toggleSubscript, toggleSuperscript, toggleTaskItemCheckbox, toggleUnderline, undo } from '@atlaskit/editor-common/keymaps';
-import { alignmentMessages, annotationMessages, blockTypeMessages, listMessages, helpDialogMessages as messages, toolbarInsertBlockMessages, toolbarMessages, undoRedoMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
-import { browser } from '@atlaskit/editor-common/utils';
-import CrossIcon from '@atlaskit/icon/glyph/cross';
-import AkModalDialog, { ModalTransition, useModal } from '@atlaskit/modal-dialog';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
+import AkModalDialog, { ModalTransition } from '@atlaskit/modal-dialog';
 import { closeHelpCommand } from '../commands';
-import { codeLg, codeMd, codeSm, column, componentFromKeymapWrapperStyles, content, contentWrapper, dialogHeader, footer, header, line, row, shortcutsArray, title } from './styles';
-var navigationKeymaps = function navigationKeymaps(_ref) {
-  var formatMessage = _ref.formatMessage;
-  return [{
-    name: formatMessage(toolbarMessages.navigateToEditorToolbar),
-    type: 'navigation',
-    keymap: function keymap() {
-      return navToEditorToolbar;
-    }
-  }, {
-    name: formatMessage(toolbarMessages.navigateToFloatingToolbar),
-    type: 'navigation',
-    keymap: function keymap() {
-      return navToFloatingToolbar;
-    }
-  }];
-};
-export var formatting = function formatting(_ref2) {
-  var formatMessage = _ref2.formatMessage;
-  return [{
-    name: formatMessage(toolbarMessages.bold),
-    type: 'strong',
-    keymap: function keymap() {
-      return toggleBold;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "**", jsx(FormattedMessage, toolbarMessages.bold), "**"));
-    }
-  }, {
-    name: formatMessage(toolbarMessages.italic),
-    type: 'em',
-    keymap: function keymap() {
-      return toggleItalic;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "*", jsx(FormattedMessage, toolbarMessages.italic), "*"));
-    }
-  }, {
-    name: formatMessage(toolbarMessages.underline),
-    type: 'underline',
-    keymap: function keymap() {
-      return toggleUnderline;
-    }
-  }, {
-    name: formatMessage(toolbarMessages.strike),
-    type: 'strike',
-    keymap: function keymap() {
-      return toggleStrikethrough;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "~~", jsx(FormattedMessage, toolbarMessages.strike), "~~"));
-    }
-  }, {
-    name: formatMessage(toolbarMessages.subscript),
-    type: 'subsup',
-    keymap: function keymap() {
-      return toggleSubscript;
-    }
-  }, {
-    name: formatMessage(toolbarMessages.superscript),
-    type: 'subsup',
-    keymap: function keymap() {
-      return toggleSuperscript;
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.heading1),
-    type: 'heading',
-    keymap: function keymap() {
-      return toggleHeading1;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeSm
-      }, "#"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.heading2),
-    type: 'heading',
-    keymap: function keymap() {
-      return toggleHeading2;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "##"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.heading3),
-    type: 'heading',
-    keymap: function keymap() {
-      return toggleHeading3;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "###"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.heading4),
-    type: 'heading',
-    keymap: function keymap() {
-      return toggleHeading4;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "####"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.heading5),
-    type: 'heading',
-    keymap: function keymap() {
-      return toggleHeading5;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "#####"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.heading6),
-    type: 'heading',
-    keymap: function keymap() {
-      return toggleHeading6;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "######"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.normal),
-    type: 'paragraph',
-    keymap: function keymap() {
-      return setNormalText;
-    }
-  }, {
-    name: formatMessage(listMessages.orderedList),
-    type: 'orderedList',
-    keymap: function keymap() {
-      return toggleOrderedList;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeSm
-      }, "1."), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(listMessages.unorderedList),
-    type: 'bulletList',
-    keymap: function keymap() {
-      return toggleBulletList;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeSm
-      }, "*"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.blockquote),
-    type: 'blockquote',
-    keymap: function keymap() {
-      return toggleBlockQuote;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, '>'), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(blockTypeMessages.codeblock),
-    type: 'codeBlock',
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "```"));
-    }
-  }, {
-    name: formatMessage(toolbarInsertBlockMessages.horizontalRule),
-    type: 'rule',
-    keymap: function keymap() {
-      return insertRule;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "---"));
-    }
-  }, {
-    name: formatMessage(toolbarInsertBlockMessages.link),
-    type: 'link',
-    keymap: function keymap() {
-      return addLink;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "[", jsx(FormattedMessage, toolbarInsertBlockMessages.link), "](http://a.com)"));
-    }
-  }, {
-    name: formatMessage(toolbarMessages.code),
-    type: 'code',
-    keymap: function keymap() {
-      return toggleCode;
-    },
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "`", jsx(FormattedMessage, toolbarMessages.code), "`"));
-    }
-  }, {
-    name: formatMessage(toolbarInsertBlockMessages.action),
-    type: 'taskItem',
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeSm
-      }, "[]"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(toolbarInsertBlockMessages.decision),
-    type: 'decisionItem',
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeSm
-      }, "<>"), " ", jsx("span", {
-        css: codeLg
-      }, "Space"));
-    }
-  }, {
-    name: formatMessage(toolbarInsertBlockMessages.emoji),
-    type: 'emoji',
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, ":"));
-    }
-  }, {
-    name: formatMessage(toolbarInsertBlockMessages.mention),
-    type: 'mention',
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "@"));
-    }
-  }, {
-    name: formatMessage(alignmentMessages.alignLeft),
-    type: 'alignment',
-    keymap: function keymap() {
-      return alignLeft;
-    }
-  }].concat(_toConsumableArray(getBooleanFF('platform.editor.text-alignment-keyboard-shortcuts') ? [{
-    name: formatMessage(alignmentMessages.alignCenter),
-    type: 'alignment',
-    keymap: function keymap() {
-      return alignCenter;
-    }
-  }, {
-    name: formatMessage(alignmentMessages.alignRight),
-    type: 'alignment',
-    keymap: function keymap() {
-      return alignRight;
-    }
-  }] : []));
-};
-var shortcutNamesWithoutKeymap = ['emoji', 'mention', 'quickInsert'];
-var otherFormatting = function otherFormatting(_ref3) {
-  var formatMessage = _ref3.formatMessage;
-  return [{
-    name: formatMessage(toolbarMessages.clearFormatting),
-    type: 'clearFormatting',
-    keymap: function keymap() {
-      return clearFormatting;
-    }
-  }, {
-    name: formatMessage(undoRedoMessages.undo),
-    type: 'undo',
-    keymap: function keymap() {
-      return undo;
-    }
-  }, {
-    name: formatMessage(undoRedoMessages.redo),
-    type: 'redo',
-    keymap: function keymap() {
-      return redo;
-    }
-  }, {
-    name: formatMessage(messages.pastePlainText),
-    type: 'paste',
-    keymap: function keymap() {
-      return pastePlainText;
-    }
-  }, {
-    name: formatMessage(annotationMessages.createComment),
-    type: 'annotation',
-    keymap: function keymap() {
-      return addInlineComment;
-    }
-  }, {
-    name: formatMessage(messages.CheckUncheckActionItem),
-    type: 'checkbox',
-    keymap: function keymap() {
-      return toggleTaskItemCheckbox;
-    }
-  }].concat(_toConsumableArray(getBooleanFF('platform.editor.a11y.table-selection_9uv33') ? [{
-    name: formatMessage(messages.selectTableRow),
-    type: 'table',
-    autoFormatting: function autoFormatting() {
-      return jsx("span", {
-        css: shortcutsArray
-      }, jsx("span", null, jsx("span", {
-        css: codeSm
-      }, browser.mac ? '⌘' : 'Ctrl'), ' + ', jsx("span", {
-        css: codeMd
-      }, browser.mac ? 'Opt' : 'Alt'), ' + ', jsx("span", {
-        css: codeMd
-      }, "Shift"), ' + ', jsx("span", {
-        css: codeSm
-      }, "\u2190")), jsx("span", null, jsx("span", {
-        css: codeSm
-      }, browser.mac ? '⌘' : 'Ctrl'), ' + ', jsx("span", {
-        css: codeMd
-      }, browser.mac ? 'Opt' : 'Alt'), ' + ', jsx("span", {
-        css: codeMd
-      }, "Shift"), ' + ', jsx("span", {
-        css: codeSm
-      }, "\u2192")));
-    }
-  }, {
-    name: formatMessage(messages.selectTableColumn),
-    type: 'table',
-    autoFormatting: function autoFormatting() {
-      return jsx("span", {
-        css: shortcutsArray
-      }, jsx("span", null, jsx("span", {
-        css: codeSm
-      }, browser.mac ? '⌘' : 'Ctrl'), ' + ', jsx("span", {
-        css: codeMd
-      }, browser.mac ? 'Opt' : 'Alt'), ' + ', jsx("span", {
-        css: codeMd
-      }, "Shift"), ' + ', jsx("span", {
-        css: codeSm
-      }, "\u2191")), jsx("span", null, jsx("span", {
-        css: codeSm
-      }, browser.mac ? '⌘' : 'Ctrl'), ' + ', jsx("span", {
-        css: codeMd
-      }, browser.mac ? 'Opt' : 'Alt'), ' + ', jsx("span", {
-        css: codeMd
-      }, "Shift"), ' + ', jsx("span", {
-        css: codeSm
-      }, "\u2193")));
-    }
-  }] : []));
-};
-var resizeInformationFormatting = function resizeInformationFormatting(_ref4) {
-  var formatMessage = _ref4.formatMessage;
-  return [{
-    name: formatMessage(messages.increaseSize),
-    type: 'media',
-    keymap: function keymap() {
-      return increaseMediaSize;
-    }
-  }, {
-    name: formatMessage(messages.decreaseSize),
-    type: 'media',
-    keymap: function keymap() {
-      return decreaseMediaSize;
-    }
-  }];
-};
-var focusTableResizeHandleFormatting = function focusTableResizeHandleFormatting(_ref5) {
-  var formatMessage = _ref5.formatMessage;
-  return [{
-    name: formatMessage(messages.focusTableResizeHandle),
-    type: 'navigation',
-    keymap: function keymap() {
-      return focusTableResizer;
-    }
-  }];
-};
-var imageAutoFormat = {
-  name: 'Image',
-  type: 'image',
-  autoFormatting: function autoFormatting() {
-    return jsx("span", null, jsx("span", {
-      css: codeLg
-    }, "![", jsx(FormattedMessage, messages.altText), "](http://www.image.com)"));
-  }
-};
-var quickInsertAutoFormat = function quickInsertAutoFormat(_ref6) {
-  var formatMessage = _ref6.formatMessage;
-  return {
-    name: formatMessage(messages.quickInsert),
-    type: 'quickInsert',
-    autoFormatting: function autoFormatting() {
-      return jsx("span", null, jsx("span", {
-        css: codeLg
-      }, "/"));
-    }
-  };
-};
-var getKeyParts = function getKeyParts(keymap) {
-  var shortcut = keymap[browser.mac ? 'mac' : 'windows'];
-  if (browser.mac) {
-    shortcut = shortcut.replace('Alt', 'Opt');
-  }
-  return shortcut.replace(/\-(?=.)/g, ' + ').split(' ');
-};
-var isAnyA11yResizeFeatureFlagEnabled = getBooleanFF('platform.editor.a11y-media-resizing_b5v0o') || getBooleanFF('platform.editor.a11y-table-resizing_uapcv');
-export var getSupportedFormatting = function getSupportedFormatting(schema, intl, imageEnabled, quickInsertEnabled) {
-  var supportedBySchema = formatting(intl).filter(function (format) {
-    return schema.nodes[format.type] || schema.marks[format.type];
-  });
-  return [].concat(_toConsumableArray(navigationKeymaps(intl)), _toConsumableArray(supportedBySchema), _toConsumableArray(imageEnabled ? [imageAutoFormat] : []), _toConsumableArray(quickInsertEnabled ? [quickInsertAutoFormat(intl)] : []), _toConsumableArray(otherFormatting(intl)), _toConsumableArray(isAnyA11yResizeFeatureFlagEnabled ? resizeInformationFormatting(intl) : []), _toConsumableArray(getBooleanFF('platform.editor.a11y-table-resizing_uapcv') ? focusTableResizeHandleFormatting(intl) : []));
-};
-export var getComponentFromKeymap = function getComponentFromKeymap(keymap) {
-  var keyParts = getKeyParts(keymap);
-  return jsx("span", {
-    css: componentFromKeymapWrapperStyles
-  }, keyParts.map(function (part, index) {
-    if (part === '+') {
-      return jsx("span", {
-        key: "".concat(keyParts, "-").concat(index)
-      }, ' + ');
-    } else if (part === 'Cmd') {
-      return jsx("span", {
-        css: codeSm,
-        key: "".concat(keyParts, "-").concat(index)
-      }, "\u2318");
-    } else if (['ctrl', 'alt', 'opt', 'shift'].indexOf(part.toLowerCase()) >= 0) {
-      return jsx("span", {
-        css: codeMd,
-        key: "".concat(keyParts, "-").concat(index)
-      }, part);
-    } else if (['f9', 'f10'].indexOf(part.toLowerCase()) >= 0) {
-      return jsx("span", {
-        css: codeLg,
-        key: "".concat(keyParts, "-").concat(index)
-      }, part);
-    } else if (part.toLowerCase() === 'enter') {
-      return jsx("span", {
-        css: codeSm,
-        key: "".concat(keyParts, "-").concat(index)
-      }, '⏎');
-    }
-    return jsx("span", {
-      css: codeSm,
-      key: "".concat(keyParts, "-").concat(index)
-    }, part.toUpperCase());
-  }));
-};
-var ModalHeader = injectIntl(function (_ref7) {
-  var formatMessage = _ref7.intl.formatMessage;
-  var _useModal = useModal(),
-    onClose = _useModal.onClose;
-  return jsx("div", {
-    css: header
-  }, jsx("h1", {
-    css: dialogHeader
-  }, jsx(FormattedMessage, messages.editorHelp)), jsx("div", null, jsx(ToolbarButton
-  // @ts-ignore
-  , {
-    onClick: onClose,
-    title: formatMessage(messages.closeHelpDialog),
-    spacing: "compact",
-    iconBefore: jsx(CrossIcon, {
-      label: formatMessage(messages.closeHelpDialog),
-      size: "medium"
-    })
-  })));
-});
-var ModalFooter = function ModalFooter() {
-  return jsx("div", {
-    css: footer
-  }, jsx(FormattedMessage, _extends({}, messages.helpDialogTips, {
-    values: {
-      keyMap: getComponentFromKeymap(openHelp)
-    }
-  })));
-};
-var HelpDialog = function HelpDialog(_ref8) {
-  var pluginInjectionApi = _ref8.pluginInjectionApi,
-    editorView = _ref8.editorView,
-    quickInsertEnabled = _ref8.quickInsertEnabled,
-    intl = _ref8.intl;
+import { getSupportedFormatting } from './formatting';
+import Modal from './Modal';
+var HelpDialog = function HelpDialog(_ref) {
+  var pluginInjectionApi = _ref.pluginInjectionApi,
+    editorView = _ref.editorView,
+    quickInsertEnabled = _ref.quickInsertEnabled,
+    intl = _ref.intl;
   var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['helpDialog']),
     helpDialogState = _useSharedPluginState.helpDialogState;
   var closeDialog = useCallback(function () {
@@ -546,46 +35,8 @@ var HelpDialog = function HelpDialog(_ref8) {
     width: "large",
     onClose: closeDialog,
     testId: "help-modal-dialog"
-  }, jsx(ModalHeader, null), jsx("div", {
-    css: contentWrapper
-  }, jsx("div", {
-    css: line
-  }), jsx("div", {
-    css: content
-  }, jsx("div", {
-    css: column
-  }, jsx("h2", {
-    css: title
-  }, jsx(FormattedMessage, messages.keyboardShortcuts)), jsx("ul", null, formatting.filter(function (form) {
-    var keymap = form.keymap && form.keymap();
-    return keymap && keymap[browser.mac ? 'mac' : 'windows'];
-  }).map(function (form) {
-    return jsx("li", {
-      css: row,
-      key: "textFormatting-".concat(form.name)
-    }, jsx("span", null, form.name), getComponentFromKeymap(form.keymap()));
-  }), formatting.filter(function (form) {
-    return shortcutNamesWithoutKeymap.indexOf(form.type) !== -1;
-  }).filter(function (form) {
-    return form.autoFormatting;
-  }).map(function (form) {
-    return jsx("li", {
-      css: row,
-      key: "autoFormatting-".concat(form.name)
-    }, jsx("span", null, form.name), form.autoFormatting());
-  }))), jsx("div", {
-    css: line
-  }), jsx("div", {
-    css: column
-  }, jsx("h2", {
-    css: title
-  }, jsx(FormattedMessage, messages.markdown)), jsx("ul", null, formatting.filter(function (form) {
-    return shortcutNamesWithoutKeymap.indexOf(form.type) === -1;
-  }).map(function (form) {
-    return form.autoFormatting && jsx("li", {
-      key: "autoFormatting-".concat(form.name),
-      css: row
-    }, jsx("span", null, form.name), form.autoFormatting());
-  }))))), jsx(ModalFooter, null)) : null);
+  }, jsx(Modal, {
+    formatting: formatting
+  })) : null);
 };
 export default injectIntl(HelpDialog);

package/dist/esm/ui/utils.js

@@ -0,0 +1,48 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import { browser } from '@atlaskit/editor-common/utils';
+import { codeLg, codeMd, codeSm, componentFromKeymapWrapperStyles } from './styles';
+var getKeyParts = function getKeyParts(keymap) {
+  var shortcut = keymap[browser.mac ? 'mac' : 'windows'];
+  if (browser.mac) {
+    shortcut = shortcut.replace('Alt', 'Opt');
+  }
+  return shortcut.replace(/\-(?=.)/g, ' + ').split(' ');
+};
+export var shortcutNamesWithoutKeymap = ['emoji', 'mention', 'quickInsert'];
+export var getComponentFromKeymap = function getComponentFromKeymap(keymap) {
+  var keyParts = getKeyParts(keymap);
+  return jsx("span", {
+    css: componentFromKeymapWrapperStyles
+  }, keyParts.map(function (part, index) {
+    if (part === '+') {
+      return jsx("span", {
+        key: "".concat(keyParts, "-").concat(index)
+      }, ' + ');
+    } else if (part === 'Cmd') {
+      return jsx("span", {
+        css: codeSm,
+        key: "".concat(keyParts, "-").concat(index)
+      }, "\u2318");
+    } else if (['ctrl', 'alt', 'opt', 'shift'].indexOf(part.toLowerCase()) >= 0) {
+      return jsx("span", {
+        css: codeMd,
+        key: "".concat(keyParts, "-").concat(index)
+      }, part);
+    } else if (['f9', 'f10'].indexOf(part.toLowerCase()) >= 0) {
+      return jsx("span", {
+        css: codeLg,
+        key: "".concat(keyParts, "-").concat(index)
+      }, part);
+    } else if (part.toLowerCase() === 'enter') {
+      return jsx("span", {
+        css: codeSm,
+        key: "".concat(keyParts, "-").concat(index)
+      }, '⏎');
+    }
+    return jsx("span", {
+      css: codeSm,
+      key: "".concat(keyParts, "-").concat(index)
+    }, part.toUpperCase());
+  }));
+};

package/dist/types/ui/Format.d.ts

@@ -0,0 +1,8 @@
+interface Format {
+    name: string;
+    type: string;
+    keymap?: Function;
+    autoFormatting?: Function;
+    imageEnabled?: boolean;
+}
+export default Format;

package/dist/types/ui/HelpDialogLoader.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import Loadable from 'react-loadable';
 import type { HelpDialogProps } from './index';
-export declare const HelpDialogLoader: import("react").ComponentType<HelpDialogProps> & Loadable.LoadableComponent;
+export declare const HelpDialogLoader: import("react").ComponentType<import("react").PropsWithChildren<HelpDialogProps>> & Loadable.LoadableComponent;

package/dist/types/ui/Modal.d.ts

@@ -0,0 +1,8 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import type Format from './Format';
+interface ModalProps {
+    formatting: Format[];
+}
+declare const Modal: ({ formatting }: ModalProps) => jsx.JSX.Element;
+export default Modal;

package/dist/types/ui/ModalContent.d.ts

@@ -0,0 +1,9 @@
+import { jsx } from '@emotion/react';
+import type { OnCloseHandler } from '@atlaskit/modal-dialog';
+import type Format from './Format';
+interface ModalContentProps {
+    formatting: Format[];
+    onClose: OnCloseHandler | undefined;
+}
+export declare const ModalContent: ({ formatting, onClose }: ModalContentProps) => jsx.JSX.Element;
+export default ModalContent;

package/dist/types/ui/ModalFooter.d.ts

@@ -0,0 +1,4 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+declare const ModalFooter: () => jsx.JSX.Element;
+export default ModalFooter;

package/dist/types/ui/ModalHeader.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { WrappedComponentProps } from 'react-intl-next';
+import type { OnCloseHandler } from '@atlaskit/modal-dialog';
+interface ModalHeaderProps extends WrappedComponentProps {
+    onClose: OnCloseHandler | undefined;
+}
+declare const ModalHeader: import("react").FC<import("react-intl-next").WithIntlProps<ModalHeaderProps>> & {
+    WrappedComponent: import("react").ComponentType<ModalHeaderProps>;
+};
+export default ModalHeader;