@atlaskit/editor-core 189.4.1 → 189.4.3

package/dist/es2019/plugins/toolbar-lists-indentation/ui/ToolbarDropdown.js

@@ -1,158 +0,0 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import React from 'react';
-import { useIntl } from 'react-intl-next';
-import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
-import BulletListIcon from '@atlaskit/icon/glyph/editor/bullet-list';
-import { toggleBulletList as toggleBulletListKeymap, toggleOrderedList as toggleOrderedListKeymap, indent as toggleIndentKeymap, outdent as toggleOutdentKeymap, tooltip } from '../../../keymaps';
-import { DropdownMenuWithKeyboardNavigation as DropdownMenu } from '@atlaskit/editor-common/ui-menu';
-import ToolbarButton from '../../../ui/ToolbarButton';
-import { shortcutStyle } from '../../../ui/styles';
-import { expandIconWrapperStyle } from '@atlaskit/editor-common/styles';
-import { wrapperStyle, separatorStyles } from '@atlaskit/editor-common/styles';
-import { listMessages, indentationMessages } from '@atlaskit/editor-common/messages';
-export function ToolbarDropdown(props) {
-  const {
-    formatMessage
-  } = useIntl();
-  const {
-    disabled,
-    isReducedSpacing,
-    bulletListActive,
-    orderedListActive,
-    popupsMountPoint,
-    popupsBoundariesElement,
-    popupsScrollableElement,
-    onItemActivated
-  } = props;
-  const [isDropdownOpen, setIsDropdownOpen] = React.useState(false);
-  const [isOpenedByKeyboard, setOpenedByKeyboard] = React.useState(false);
-  const labelLists = formatMessage(listMessages.lists);
-  const onOpenChange = attrs => {
-    setIsDropdownOpen(attrs.isDropdownOpen);
-  };
-  const handleTriggerClick = () => {
-    onOpenChange({
-      isDropdownOpen: !isDropdownOpen
-    });
-  };
-  const handleOnKeyDown = event => {
-    if (event.key === 'Enter' || event.key === ' ') {
-      event.preventDefault();
-      setIsDropdownOpen(!isDropdownOpen);
-      setOpenedByKeyboard(true);
-    }
-  };
-  const items = useItems(props);
-  const handleOnItemActivated = ({
-    item,
-    shouldCloseMenu = true
-  }) => {
-    setIsDropdownOpen(!shouldCloseMenu);
-    return onItemActivated({
-      editorView: props.editorView,
-      buttonName: item.value.name
-    });
-  };
-  return jsx("span", {
-    css: wrapperStyle
-  }, jsx(DropdownMenu, {
-    items: items,
-    onItemActivated: handleOnItemActivated,
-    mountTo: popupsMountPoint,
-    boundariesElement: popupsBoundariesElement,
-    scrollableElement: popupsScrollableElement,
-    isOpen: isDropdownOpen,
-    onOpenChange: onOpenChange,
-    fitHeight: 188,
-    fitWidth: 175,
-    shouldUseDefaultRole: true,
-    shouldFocusFirstItem: () => {
-      if (isOpenedByKeyboard) {
-        setOpenedByKeyboard(false);
-      }
-      return isOpenedByKeyboard;
-    }
-  }, jsx(ToolbarButton, {
-    spacing: isReducedSpacing ? 'none' : 'default',
-    selected: bulletListActive || orderedListActive,
-    "aria-expanded": isDropdownOpen,
-    "aria-haspopup": true,
-    "aria-label": labelLists,
-    disabled: disabled,
-    onClick: handleTriggerClick,
-    onKeyDown: handleOnKeyDown,
-    title: labelLists,
-    iconBefore: jsx("span", {
-      css: wrapperStyle
-    }, jsx(BulletListIcon, {
-      label: labelLists
-    }), jsx("span", {
-      css: expandIconWrapperStyle
-    }, jsx(ExpandIcon, {
-      label: ""
-    })))
-  })), jsx("span", {
-    css: separatorStyles
-  }));
-}
-function useItems(props) {
-  const {
-    formatMessage
-  } = useIntl();
-  const labelUnorderedList = formatMessage(listMessages.unorderedList);
-  const labelOrderedList = formatMessage(listMessages.orderedList);
-  let items = [{
-    key: 'unorderedList',
-    content: labelUnorderedList,
-    value: {
-      name: 'bullet_list'
-    },
-    isDisabled: props.bulletListDisabled,
-    isActive: Boolean(props.bulletListActive),
-    elemAfter: jsx("div", {
-      css: shortcutStyle
-    }, tooltip(toggleBulletListKeymap))
-  }, {
-    key: 'orderedList',
-    content: labelOrderedList,
-    value: {
-      name: 'ordered_list'
-    },
-    isDisabled: props.orderedListDisabled,
-    isActive: Boolean(props.orderedListActive),
-    elemAfter: jsx("div", {
-      css: shortcutStyle
-    }, tooltip(toggleOrderedListKeymap))
-  }];
-  if (props.showIndentationButtons) {
-    const labelIndent = formatMessage(indentationMessages.indent);
-    const labelOutdent = formatMessage(indentationMessages.outdent);
-    items.push({
-      key: 'outdent',
-      content: labelOutdent,
-      value: {
-        name: 'outdent'
-      },
-      isDisabled: props.outdentDisabled,
-      isActive: false,
-      elemAfter: jsx("div", {
-        css: shortcutStyle
-      }, tooltip(toggleOutdentKeymap))
-    }, {
-      key: 'indent',
-      content: labelIndent,
-      value: {
-        name: 'indent'
-      },
-      isDisabled: props.indentDisabled,
-      isActive: false,
-      elemAfter: jsx("div", {
-        css: shortcutStyle
-      }, tooltip(toggleIndentKeymap))
-    });
-  }
-  return [{
-    items
-  }];
-}

package/dist/es2019/plugins/toolbar-lists-indentation/ui/index.js

@@ -1,58 +0,0 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import { onItemActivated } from './onItemActivated';
-import { ToolbarDropdown } from './ToolbarDropdown';
-import { Toolbar } from './Toolbar';
-export default function ToolbarListsIndentation(props) {
-  const {
-    disabled,
-    isSmall,
-    isReducedSpacing,
-    bulletListActive,
-    bulletListDisabled,
-    orderedListActive,
-    orderedListDisabled,
-    showIndentationButtons,
-    popupsMountPoint,
-    popupsBoundariesElement,
-    popupsScrollableElement,
-    indentDisabled,
-    outdentDisabled,
-    indentationStateNode,
-    featureFlags,
-    pluginInjectionApi
-  } = props;
-  if (isSmall) {
-    return jsx(ToolbarDropdown, {
-      editorView: props.editorView,
-      isReducedSpacing: isReducedSpacing,
-      popupsMountPoint: popupsMountPoint,
-      popupsBoundariesElement: popupsBoundariesElement,
-      popupsScrollableElement: popupsScrollableElement,
-      bulletListActive: bulletListActive,
-      bulletListDisabled: bulletListDisabled,
-      showIndentationButtons: showIndentationButtons,
-      orderedListActive: orderedListActive,
-      orderedListDisabled: orderedListDisabled,
-      indentDisabled: indentDisabled,
-      outdentDisabled: outdentDisabled,
-      disabled: disabled,
-      onItemActivated: onItemActivated(pluginInjectionApi, indentationStateNode),
-      featureFlags: featureFlags
-    });
-  }
-  return jsx(Toolbar, {
-    editorView: props.editorView,
-    isReducedSpacing: isReducedSpacing,
-    bulletListActive: bulletListActive,
-    bulletListDisabled: bulletListDisabled,
-    showIndentationButtons: showIndentationButtons,
-    orderedListActive: orderedListActive,
-    orderedListDisabled: orderedListDisabled,
-    indentDisabled: indentDisabled,
-    outdentDisabled: outdentDisabled,
-    disabled: disabled,
-    onItemActivated: onItemActivated(pluginInjectionApi, indentationStateNode),
-    featureFlags: featureFlags
-  });
-}

package/dist/es2019/plugins/toolbar-lists-indentation/ui/onItemActivated.js

@@ -1,46 +0,0 @@
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-export const onItemActivated = (pluginInjectionApi, indentationStateNode) => ({
-  buttonName,
-  editorView
-}) => {
-  switch (buttonName) {
-    case 'bullet_list':
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.list.commands.toggleBulletList(INPUT_METHOD.TOOLBAR));
-      break;
-    case 'ordered_list':
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.list.commands.toggleOrderedList(INPUT_METHOD.TOOLBAR));
-      break;
-    case 'indent':
-      {
-        const node = indentationStateNode;
-        if (node === 'paragraph_heading') {
-          var _pluginInjectionApi$i;
-          pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$i = pluginInjectionApi.indentation) === null || _pluginInjectionApi$i === void 0 ? void 0 : _pluginInjectionApi$i.actions.indentParagraphOrHeading(INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
-        }
-        if (node === 'list') {
-          pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.list.commands.indentList(INPUT_METHOD.TOOLBAR));
-        }
-        if (node === 'taskList') {
-          var _pluginInjectionApi$t;
-          pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$t = pluginInjectionApi.taskDecision) === null || _pluginInjectionApi$t === void 0 ? void 0 : _pluginInjectionApi$t.actions.indentTaskList(INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
-        }
-        break;
-      }
-    case 'outdent':
-      {
-        const node = indentationStateNode;
-        if (node === 'paragraph_heading') {
-          var _pluginInjectionApi$i2;
-          pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$i2 = pluginInjectionApi.indentation) === null || _pluginInjectionApi$i2 === void 0 ? void 0 : _pluginInjectionApi$i2.actions.outdentParagraphOrHeading(INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
-        }
-        if (node === 'list') {
-          pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.list.commands.outdentList(INPUT_METHOD.TOOLBAR));
-        }
-        if (node === 'taskList') {
-          var _pluginInjectionApi$t2;
-          pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$t2 = pluginInjectionApi.taskDecision) === null || _pluginInjectionApi$t2 === void 0 ? void 0 : _pluginInjectionApi$t2.actions.outdentTaskList(INPUT_METHOD.TOOLBAR)(editorView.state, editorView.dispatch);
-        }
-        break;
-      }
-  }
-};

package/dist/esm/plugins/toolbar-lists-indentation/index.js

@@ -1,83 +0,0 @@
-import React from 'react';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
-import ToolbarListsIndentation from './ui';
-import { ToolbarSize } from '../../ui/Toolbar/types';
-import { getIndentationButtonsState } from './pm-plugins/indentation-buttons';
-var toolbarListsIndentationPlugin = function toolbarListsIndentationPlugin(_ref) {
-  var _api$featureFlags;
-  var config = _ref.config,
-    api = _ref.api;
-  var _ref2 = config !== null && config !== void 0 ? config : {},
-    _ref2$showIndentation = _ref2.showIndentationButtons,
-    showIndentationButtons = _ref2$showIndentation === void 0 ? false : _ref2$showIndentation,
-    _ref2$allowHeadingAnd = _ref2.allowHeadingAndParagraphIndentation,
-    allowHeadingAndParagraphIndentation = _ref2$allowHeadingAnd === void 0 ? false : _ref2$allowHeadingAnd;
-  var featureFlags = (api === null || api === void 0 || (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState()) || {};
-  return {
-    name: 'toolbarListsIndentation',
-    primaryToolbarComponent: function primaryToolbarComponent(_ref3) {
-      var editorView = _ref3.editorView,
-        popupsMountPoint = _ref3.popupsMountPoint,
-        popupsBoundariesElement = _ref3.popupsBoundariesElement,
-        popupsScrollableElement = _ref3.popupsScrollableElement,
-        toolbarSize = _ref3.toolbarSize,
-        disabled = _ref3.disabled,
-        isToolbarReducedSpacing = _ref3.isToolbarReducedSpacing;
-      var isSmall = toolbarSize < ToolbarSize.L;
-      return /*#__PURE__*/React.createElement(PrimaryToolbarComponent, {
-        featureFlags: featureFlags,
-        popupsMountPoint: popupsMountPoint,
-        popupsBoundariesElement: popupsBoundariesElement,
-        popupsScrollableElement: popupsScrollableElement,
-        isSmall: isSmall,
-        isToolbarReducedSpacing: isToolbarReducedSpacing,
-        disabled: disabled,
-        editorView: editorView,
-        showIndentationButtons: showIndentationButtons,
-        pluginInjectionApi: api,
-        allowHeadingAndParagraphIndentation: allowHeadingAndParagraphIndentation
-      });
-    }
-  };
-};
-export function PrimaryToolbarComponent(_ref4) {
-  var featureFlags = _ref4.featureFlags,
-    popupsMountPoint = _ref4.popupsMountPoint,
-    popupsBoundariesElement = _ref4.popupsBoundariesElement,
-    popupsScrollableElement = _ref4.popupsScrollableElement,
-    isSmall = _ref4.isSmall,
-    isToolbarReducedSpacing = _ref4.isToolbarReducedSpacing,
-    disabled = _ref4.disabled,
-    editorView = _ref4.editorView,
-    showIndentationButtons = _ref4.showIndentationButtons,
-    pluginInjectionApi = _ref4.pluginInjectionApi,
-    allowHeadingAndParagraphIndentation = _ref4.allowHeadingAndParagraphIndentation;
-  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['list', 'indentation', 'taskDecision']),
-    listState = _useSharedPluginState.listState,
-    indentationState = _useSharedPluginState.indentationState,
-    taskDecisionState = _useSharedPluginState.taskDecisionState;
-  var toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState, indentationState, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.list.actions.isInsideListItem);
-  if (!listState) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement(ToolbarListsIndentation, {
-    featureFlags: featureFlags,
-    isSmall: isSmall,
-    isReducedSpacing: isToolbarReducedSpacing,
-    disabled: disabled,
-    editorView: editorView,
-    popupsMountPoint: popupsMountPoint,
-    popupsBoundariesElement: popupsBoundariesElement,
-    popupsScrollableElement: popupsScrollableElement,
-    bulletListActive: listState.bulletListActive,
-    bulletListDisabled: listState.bulletListDisabled,
-    orderedListActive: listState.orderedListActive,
-    orderedListDisabled: listState.orderedListDisabled,
-    showIndentationButtons: !!showIndentationButtons,
-    indentDisabled: toolbarListsIndentationState.indentDisabled,
-    outdentDisabled: toolbarListsIndentationState.outdentDisabled,
-    indentationStateNode: toolbarListsIndentationState === null || toolbarListsIndentationState === void 0 ? void 0 : toolbarListsIndentationState.node,
-    pluginInjectionApi: pluginInjectionApi
-  });
-}
-export default toolbarListsIndentationPlugin;

package/dist/esm/plugins/toolbar-lists-indentation/pm-plugins/indentation-buttons.js

@@ -1,50 +0,0 @@
-import { hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
-import { getListItemAttributes } from '@atlaskit/editor-common/lists';
-import { MAX_INDENTATION_LEVEL } from '@atlaskit/editor-common/indentation';
-export function getIndentationButtonsState(editorState, allowHeadingAndParagraphIndentation, taskDecisionState, indentationState, isInsideListItem) {
-  var _indentationState$isI;
-  var state = {
-    indentDisabled: true,
-    outdentDisabled: true,
-    node: null
-  };
-  var selection = editorState.selection;
-
-  // Handle bullet and numbered lists seperately as they do
-  // not use the indentation mark.
-  // Check for lists before paragraphs and headings in case
-  // the selection is in a list nested in a layout column.
-  if (isInsideListItem !== null && isInsideListItem !== void 0 && isInsideListItem(editorState.tr)) {
-    var _getListItemAttribute = getListItemAttributes(selection.$head),
-      indentLevel = _getListItemAttribute.indentLevel,
-      itemIndex = _getListItemAttribute.itemIndex;
-    return {
-      // List indent levels are zero indexed so we need to subtract 1
-      indentDisabled: itemIndex === 0 || indentLevel >= MAX_INDENTATION_LEVEL - 1,
-      outdentDisabled: false,
-      node: 'list'
-    };
-  }
-
-  // Handle tasks seperately as they do not use the indentation mark
-  // and have different behaviour for outdent compared to lists
-  if (taskDecisionState !== null && taskDecisionState !== void 0 && taskDecisionState.isInsideTask) {
-    return {
-      indentDisabled: taskDecisionState.indentDisabled,
-      outdentDisabled: taskDecisionState.outdentDisabled,
-      node: 'taskList'
-    };
-  }
-  var isTopLevelParagraphOrHeading = selection.$from.depth === 1;
-  var isInLayoutNode = hasParentNodeOfType(editorState.schema.nodes.layoutColumn)(selection) &&
-  // depth of non-nested paragraphs and headings in layouts will always be 3
-  selection.$from.depth === 3;
-  if (allowHeadingAndParagraphIndentation && ((_indentationState$isI = indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed) !== null && _indentationState$isI !== void 0 ? _indentationState$isI : false) && (isTopLevelParagraphOrHeading || isInLayoutNode) && indentationState) {
-    return {
-      indentDisabled: indentationState.indentDisabled,
-      outdentDisabled: indentationState.outdentDisabled,
-      node: 'paragraph_heading'
-    };
-  }
-  return state;
-}

package/dist/esm/plugins/toolbar-lists-indentation/types.js

@@ -1 +0,0 @@
-export {};

package/dist/esm/plugins/toolbar-lists-indentation/ui/Toolbar.js

@@ -1,124 +0,0 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import { useIntl } from 'react-intl-next';
-import BulletListIcon from '@atlaskit/icon/glyph/editor/bullet-list';
-import NumberListIcon from '@atlaskit/icon/glyph/editor/number-list';
-import IndentIcon from '@atlaskit/icon/glyph/editor/indent';
-import OutdentIcon from '@atlaskit/icon/glyph/editor/outdent';
-import { toggleBulletList as toggleBulletListKeymap, toggleOrderedList as toggleOrderedListKeymap, indent as toggleIndentKeymap, outdent as toggleOutdentKeymap, ToolTipContent, tooltip } from '../../../keymaps';
-import ToolbarButton, { TOOLBAR_BUTTON } from '../../../ui/ToolbarButton';
-import { listMessages as messages, indentationMessages } from '@atlaskit/editor-common/messages';
-import { separatorStyles, buttonGroupStyle } from '@atlaskit/editor-common/styles';
-import { getAriaKeyshortcuts } from '@atlaskit/editor-common/keymaps';
-import { useEffect, useRef } from 'react';
-export function Toolbar(props) {
-  var _useIntl = useIntl(),
-    formatMessage = _useIntl.formatMessage;
-  var indentButtonRef = useRef(null);
-  var outdentButtonRef = useRef(null);
-  var disabled = props.disabled,
-    isReducedSpacing = props.isReducedSpacing,
-    bulletListActive = props.bulletListActive,
-    bulletListDisabled = props.bulletListDisabled,
-    orderedListActive = props.orderedListActive,
-    orderedListDisabled = props.orderedListDisabled,
-    showIndentationButtons = props.showIndentationButtons,
-    indentDisabled = props.indentDisabled,
-    outdentDisabled = props.outdentDisabled,
-    onItemActivated = props.onItemActivated;
-  var labelUnorderedList = formatMessage(messages.unorderedList);
-  var labelOrderedList = formatMessage(messages.orderedList);
-  var indentMessage = formatMessage(indentationMessages.indent);
-  var outdentMessage = formatMessage(indentationMessages.outdent);
-  var isIndentButtonFocused = document.activeElement === indentButtonRef.current;
-  var isOutdentButtonFocused = document.activeElement === outdentButtonRef.current;
-  var handleOnItemActivated = function handleOnItemActivated(buttonName) {
-    return function (event) {
-      return onItemActivated({
-        editorView: props.editorView,
-        buttonName: buttonName
-      });
-    };
-  };
-  useEffect(function () {
-    if (isIndentButtonFocused && indentDisabled && outdentButtonRef.current) {
-      outdentButtonRef.current.focus();
-    }
-  }, [indentButtonRef, indentDisabled, isIndentButtonFocused]);
-  useEffect(function () {
-    if (isOutdentButtonFocused && outdentDisabled && indentButtonRef.current) {
-      indentButtonRef.current.focus();
-    }
-  }, [outdentButtonRef, outdentDisabled, isOutdentButtonFocused]);
-  return jsx("span", {
-    css: buttonGroupStyle
-  }, jsx(ToolbarButton, {
-    buttonId: TOOLBAR_BUTTON.BULLET_LIST,
-    testId: labelUnorderedList,
-    spacing: isReducedSpacing ? 'none' : 'default',
-    onClick: handleOnItemActivated('bullet_list'),
-    selected: bulletListActive,
-    "aria-pressed": bulletListActive,
-    "aria-label": tooltip(toggleBulletListKeymap, labelUnorderedList),
-    "aria-keyshortcuts": getAriaKeyshortcuts(toggleBulletListKeymap),
-    disabled: bulletListDisabled || disabled,
-    title: jsx(ToolTipContent, {
-      description: labelUnorderedList,
-      keymap: toggleBulletListKeymap
-    }),
-    iconBefore: jsx(BulletListIcon, {
-      label: ""
-    })
-  }), jsx(ToolbarButton, {
-    buttonId: TOOLBAR_BUTTON.ORDERED_LIST,
-    testId: labelOrderedList,
-    spacing: isReducedSpacing ? 'none' : 'default',
-    onClick: handleOnItemActivated('ordered_list'),
-    selected: orderedListActive,
-    "aria-pressed": orderedListActive,
-    "aria-label": tooltip(toggleOrderedListKeymap, labelOrderedList),
-    "aria-keyshortcuts": getAriaKeyshortcuts(toggleOrderedListKeymap),
-    disabled: orderedListDisabled || disabled,
-    title: jsx(ToolTipContent, {
-      description: labelOrderedList,
-      keymap: toggleOrderedListKeymap
-    }),
-    iconBefore: jsx(NumberListIcon, {
-      label: ""
-    })
-  }), showIndentationButtons && jsx(ToolbarButton, {
-    buttonId: TOOLBAR_BUTTON.OUTDENT,
-    testId: TOOLBAR_BUTTON.OUTDENT,
-    ref: outdentButtonRef,
-    spacing: isReducedSpacing ? 'none' : 'default',
-    onClick: handleOnItemActivated('outdent'),
-    iconBefore: jsx(OutdentIcon, {
-      label: ""
-    }),
-    disabled: outdentDisabled || disabled,
-    "aria-label": tooltip(toggleOutdentKeymap, outdentMessage),
-    "aria-keyshortcuts": getAriaKeyshortcuts(toggleOutdentKeymap),
-    title: jsx(ToolTipContent, {
-      description: outdentMessage,
-      keymap: toggleOutdentKeymap
-    })
-  }), showIndentationButtons && jsx(ToolbarButton, {
-    buttonId: TOOLBAR_BUTTON.INDENT,
-    testId: TOOLBAR_BUTTON.INDENT,
-    ref: indentButtonRef,
-    spacing: isReducedSpacing ? 'none' : 'default',
-    onClick: handleOnItemActivated('indent'),
-    iconBefore: jsx(IndentIcon, {
-      label: ""
-    }),
-    disabled: indentDisabled || disabled,
-    "aria-label": tooltip(toggleIndentKeymap, indentMessage),
-    "aria-keyshortcuts": getAriaKeyshortcuts(toggleIndentKeymap),
-    title: jsx(ToolTipContent, {
-      description: indentMessage,
-      keymap: toggleIndentKeymap
-    })
-  }), jsx("span", {
-    css: separatorStyles
-  }));
-}

package/dist/esm/plugins/toolbar-lists-indentation/ui/ToolbarDropdown.js

@@ -1,161 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import React from 'react';
-import { useIntl } from 'react-intl-next';
-import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
-import BulletListIcon from '@atlaskit/icon/glyph/editor/bullet-list';
-import { toggleBulletList as toggleBulletListKeymap, toggleOrderedList as toggleOrderedListKeymap, indent as toggleIndentKeymap, outdent as toggleOutdentKeymap, tooltip } from '../../../keymaps';
-import { DropdownMenuWithKeyboardNavigation as DropdownMenu } from '@atlaskit/editor-common/ui-menu';
-import ToolbarButton from '../../../ui/ToolbarButton';
-import { shortcutStyle } from '../../../ui/styles';
-import { expandIconWrapperStyle } from '@atlaskit/editor-common/styles';
-import { wrapperStyle, separatorStyles } from '@atlaskit/editor-common/styles';
-import { listMessages, indentationMessages } from '@atlaskit/editor-common/messages';
-export function ToolbarDropdown(props) {
-  var _useIntl = useIntl(),
-    formatMessage = _useIntl.formatMessage;
-  var disabled = props.disabled,
-    isReducedSpacing = props.isReducedSpacing,
-    bulletListActive = props.bulletListActive,
-    orderedListActive = props.orderedListActive,
-    popupsMountPoint = props.popupsMountPoint,
-    popupsBoundariesElement = props.popupsBoundariesElement,
-    popupsScrollableElement = props.popupsScrollableElement,
-    onItemActivated = props.onItemActivated;
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isDropdownOpen = _React$useState2[0],
-    setIsDropdownOpen = _React$useState2[1];
-  var _React$useState3 = React.useState(false),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    isOpenedByKeyboard = _React$useState4[0],
-    setOpenedByKeyboard = _React$useState4[1];
-  var labelLists = formatMessage(listMessages.lists);
-  var onOpenChange = function onOpenChange(attrs) {
-    setIsDropdownOpen(attrs.isDropdownOpen);
-  };
-  var handleTriggerClick = function handleTriggerClick() {
-    onOpenChange({
-      isDropdownOpen: !isDropdownOpen
-    });
-  };
-  var handleOnKeyDown = function handleOnKeyDown(event) {
-    if (event.key === 'Enter' || event.key === ' ') {
-      event.preventDefault();
-      setIsDropdownOpen(!isDropdownOpen);
-      setOpenedByKeyboard(true);
-    }
-  };
-  var items = useItems(props);
-  var handleOnItemActivated = function handleOnItemActivated(_ref) {
-    var item = _ref.item,
-      _ref$shouldCloseMenu = _ref.shouldCloseMenu,
-      shouldCloseMenu = _ref$shouldCloseMenu === void 0 ? true : _ref$shouldCloseMenu;
-    setIsDropdownOpen(!shouldCloseMenu);
-    return onItemActivated({
-      editorView: props.editorView,
-      buttonName: item.value.name
-    });
-  };
-  return jsx("span", {
-    css: wrapperStyle
-  }, jsx(DropdownMenu, {
-    items: items,
-    onItemActivated: handleOnItemActivated,
-    mountTo: popupsMountPoint,
-    boundariesElement: popupsBoundariesElement,
-    scrollableElement: popupsScrollableElement,
-    isOpen: isDropdownOpen,
-    onOpenChange: onOpenChange,
-    fitHeight: 188,
-    fitWidth: 175,
-    shouldUseDefaultRole: true,
-    shouldFocusFirstItem: function shouldFocusFirstItem() {
-      if (isOpenedByKeyboard) {
-        setOpenedByKeyboard(false);
-      }
-      return isOpenedByKeyboard;
-    }
-  }, jsx(ToolbarButton, {
-    spacing: isReducedSpacing ? 'none' : 'default',
-    selected: bulletListActive || orderedListActive,
-    "aria-expanded": isDropdownOpen,
-    "aria-haspopup": true,
-    "aria-label": labelLists,
-    disabled: disabled,
-    onClick: handleTriggerClick,
-    onKeyDown: handleOnKeyDown,
-    title: labelLists,
-    iconBefore: jsx("span", {
-      css: wrapperStyle
-    }, jsx(BulletListIcon, {
-      label: labelLists
-    }), jsx("span", {
-      css: expandIconWrapperStyle
-    }, jsx(ExpandIcon, {
-      label: ""
-    })))
-  })), jsx("span", {
-    css: separatorStyles
-  }));
-}
-function useItems(props) {
-  var _useIntl2 = useIntl(),
-    formatMessage = _useIntl2.formatMessage;
-  var labelUnorderedList = formatMessage(listMessages.unorderedList);
-  var labelOrderedList = formatMessage(listMessages.orderedList);
-  var items = [{
-    key: 'unorderedList',
-    content: labelUnorderedList,
-    value: {
-      name: 'bullet_list'
-    },
-    isDisabled: props.bulletListDisabled,
-    isActive: Boolean(props.bulletListActive),
-    elemAfter: jsx("div", {
-      css: shortcutStyle
-    }, tooltip(toggleBulletListKeymap))
-  }, {
-    key: 'orderedList',
-    content: labelOrderedList,
-    value: {
-      name: 'ordered_list'
-    },
-    isDisabled: props.orderedListDisabled,
-    isActive: Boolean(props.orderedListActive),
-    elemAfter: jsx("div", {
-      css: shortcutStyle
-    }, tooltip(toggleOrderedListKeymap))
-  }];
-  if (props.showIndentationButtons) {
-    var labelIndent = formatMessage(indentationMessages.indent);
-    var labelOutdent = formatMessage(indentationMessages.outdent);
-    items.push({
-      key: 'outdent',
-      content: labelOutdent,
-      value: {
-        name: 'outdent'
-      },
-      isDisabled: props.outdentDisabled,
-      isActive: false,
-      elemAfter: jsx("div", {
-        css: shortcutStyle
-      }, tooltip(toggleOutdentKeymap))
-    }, {
-      key: 'indent',
-      content: labelIndent,
-      value: {
-        name: 'indent'
-      },
-      isDisabled: props.indentDisabled,
-      isActive: false,
-      elemAfter: jsx("div", {
-        css: shortcutStyle
-      }, tooltip(toggleIndentKeymap))
-    });
-  }
-  return [{
-    items: items
-  }];
-}