@atlaskit/editor-plugin-undo-redo
Version:
Undo redo plugin for @atlaskit/editor-core
48 lines • 1.9 kB
JavaScript
import React from 'react';
import { useIntl } from 'react-intl';
import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
import { getAriaKeyshortcuts, ToolTipContent, undo as undoKeymap } from '@atlaskit/editor-common/keymaps';
import { undoRedoMessages } from '@atlaskit/editor-common/messages';
import { useEditorToolbar } from '@atlaskit/editor-common/toolbar';
import { ToolbarButton, ToolbarTooltip, UndoIcon } from '@atlaskit/editor-toolbar';
import { undoFromToolbarWithAnalytics } from '../../pm-plugins/commands';
import { forceFocus } from '../../pm-plugins/utils';
export const UndoButton = ({
api
}) => {
const {
formatMessage
} = useIntl();
const {
editorView
} = useEditorToolbar();
const {
canUndo
} = useSharedPluginStateWithSelector(api, ['history'], states => {
var _states$historyState;
return {
canUndo: (_states$historyState = states.historyState) === null || _states$historyState === void 0 ? void 0 : _states$historyState.canUndo
};
});
const handleUndo = () => {
if (editorView) {
var _api$analytics;
forceFocus(editorView, api)(undoFromToolbarWithAnalytics(api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions));
}
};
return /*#__PURE__*/React.createElement(ToolbarTooltip, {
content: /*#__PURE__*/React.createElement(ToolTipContent, {
description: formatMessage(undoRedoMessages.undo),
keymap: undoKeymap
})
}, /*#__PURE__*/React.createElement(ToolbarButton, {
iconBefore: /*#__PURE__*/React.createElement(UndoIcon, {
label: formatMessage(undoRedoMessages.undo),
size: "small"
}),
onClick: handleUndo,
isDisabled: !canUndo,
ariaKeyshortcuts: getAriaKeyshortcuts(undoKeymap),
testId: "ak-editor-toolbar-button-undo"
}));
};