@atlaskit/editor-plugin-toolbar-lists-indentation
Version:
Toolbar lists and indentation plugin for @atlaskit/editor-core
65 lines (64 loc) • 3.55 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.IndentMenuItem = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactIntl = require("react-intl");
var _keymaps = require("@atlaskit/editor-common/keymaps");
var _messages = require("@atlaskit/editor-common/messages");
var _toolbar = require("@atlaskit/editor-common/toolbar");
var _editorToolbar = require("@atlaskit/editor-toolbar");
var _hooks = require("../utils/hooks");
var IndentMenuItem = exports.IndentMenuItem = function IndentMenuItem(_ref) {
var api = _ref.api,
showIndentationButtons = _ref.showIndentationButtons,
allowHeadingAndParagraphIndentation = _ref.allowHeadingAndParagraphIndentation,
parents = _ref.parents;
var _useIntl = (0, _reactIntl.useIntl)(),
formatMessage = _useIntl.formatMessage;
var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
editorView = _useEditorToolbar.editorView;
var indentationState = (0, _hooks.useIndentationState)({
api: api,
allowHeadingAndParagraphIndentation: allowHeadingAndParagraphIndentation,
state: editorView === null || editorView === void 0 ? void 0 : editorView.state
});
if (!showIndentationButtons) {
return null;
}
var onClick = function onClick() {
var inputMethod = (0, _toolbar.getInputMethodFromParentKeys)(parents);
var node = indentationState === null || indentationState === void 0 ? void 0 : indentationState.node;
if (node === 'paragraph_heading') {
if (editorView !== null && editorView !== void 0 && editorView.state) {
var _api$indentation;
api === null || api === void 0 || (_api$indentation = api.indentation) === null || _api$indentation === void 0 || _api$indentation.actions.indentParagraphOrHeading(inputMethod)(editorView === null || editorView === void 0 ? void 0 : editorView.state, editorView === null || editorView === void 0 ? void 0 : editorView.dispatch);
}
}
if (node === 'list') {
var _api$core, _api$list;
api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$list = api.list) === null || _api$list === void 0 ? void 0 : _api$list.commands.indentList(inputMethod));
}
if (node === 'taskList') {
if (editorView !== null && editorView !== void 0 && editorView.state) {
var _api$taskDecision;
api === null || api === void 0 || (_api$taskDecision = api.taskDecision) === null || _api$taskDecision === void 0 || _api$taskDecision.actions.indentTaskList(inputMethod)(editorView === null || editorView === void 0 ? void 0 : editorView.state, editorView === null || editorView === void 0 ? void 0 : editorView.dispatch);
}
}
};
var shortcut = (0, _keymaps.formatShortcut)(_keymaps.indent);
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
elemBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.IndentIcon, {
size: "small",
label: ""
}),
elemAfter: shortcut ? /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarKeyboardShortcutHint, {
shortcut: shortcut
}) : undefined,
isDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled,
ariaKeyshortcuts: shortcut,
onClick: onClick
}, formatMessage(_messages.indentationMessages.indent));
};