@atlaskit/editor-plugin-toolbar-lists-indentation
Version:
Toolbar lists and indentation plugin for @atlaskit/editor-core
76 lines • 4.54 kB
JavaScript
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import React, { useState } from 'react';
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
import { usePluginStateEffect } from '@atlaskit/editor-common/use-plugin-state-effect';
import { getIndentationButtonsState } from '../pm-plugins/indentation-buttons';
import { ToolbarType } from '../types';
import ToolbarListsIndentation from './index';
var FloatingToolbarSettings = {
disabled: false,
isToolbarReducedSpacing: true,
isSmall: true
};
export function FloatingToolbarComponent(_ref) {
var _pluginInjectionApi$l;
var featureFlags = _ref.featureFlags,
editorView = _ref.editorView,
showIndentationButtons = _ref.showIndentationButtons,
pluginInjectionApi = _ref.pluginInjectionApi,
allowHeadingAndParagraphIndentation = _ref.allowHeadingAndParagraphIndentation;
var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['list', 'indentation']),
listState = _useSharedPluginState.listState,
indentationState = _useSharedPluginState.indentationState;
var _useState = useState(),
_useState2 = _slicedToArray(_useState, 2),
taskDecisionState = _useState2[0],
setTaskDecisionState = _useState2[1];
usePluginStateEffect(pluginInjectionApi, ['taskDecision'], function (_ref2) {
var newTaskDecisionState = _ref2.taskDecisionState;
if ((newTaskDecisionState === null || newTaskDecisionState === void 0 ? void 0 : newTaskDecisionState.outdentDisabled) !== (taskDecisionState === null || taskDecisionState === void 0 ? void 0 : taskDecisionState.outdentDisabled) || (newTaskDecisionState === null || newTaskDecisionState === void 0 ? void 0 : newTaskDecisionState.indentDisabled) !== (taskDecisionState === null || taskDecisionState === void 0 ? void 0 : taskDecisionState.indentDisabled) || (newTaskDecisionState === null || newTaskDecisionState === void 0 ? void 0 : newTaskDecisionState.isInsideTask) !== (taskDecisionState === null || taskDecisionState === void 0 ? void 0 : taskDecisionState.isInsideTask)) {
setTaskDecisionState({
isInsideTask: Boolean(newTaskDecisionState === null || newTaskDecisionState === void 0 ? void 0 : newTaskDecisionState.isInsideTask),
indentDisabled: Boolean(newTaskDecisionState === null || newTaskDecisionState === void 0 ? void 0 : newTaskDecisionState.indentDisabled),
outdentDisabled: Boolean(newTaskDecisionState === null || newTaskDecisionState === void 0 ? void 0 : newTaskDecisionState.outdentDisabled)
});
}
});
var toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState, indentationState, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.list) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.isInsideListItem);
if (!listState) {
return null;
}
return /*#__PURE__*/React.createElement(ToolbarListsIndentation, {
featureFlags: featureFlags,
isSmall: FloatingToolbarSettings.isSmall,
isReducedSpacing: FloatingToolbarSettings.isToolbarReducedSpacing,
disabled: FloatingToolbarSettings.disabled,
editorView: editorView
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
,
bulletListActive: listState.bulletListActive
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
,
bulletListDisabled: listState.bulletListDisabled
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
,
orderedListActive: listState.orderedListActive
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
,
orderedListDisabled: listState.orderedListDisabled,
showIndentationButtons: !!showIndentationButtons
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
,
indentDisabled: toolbarListsIndentationState.indentDisabled
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
,
outdentDisabled: toolbarListsIndentationState.outdentDisabled,
indentationStateNode: toolbarListsIndentationState === null || toolbarListsIndentationState === void 0 ? void 0 : toolbarListsIndentationState.node,
pluginInjectionApi: pluginInjectionApi,
toolbarType: ToolbarType.FLOATING
});
}