@atlaskit/editor-plugin-text-formatting
Version:
Text-formatting plugin for @atlaskit/editor-core
104 lines • 4.23 kB
JavaScript
import React from 'react';
import { TEXT_FORMATTING_GROUP, TEXT_FORMATTING_HERO_BUTTON, TEXT_FORMATTING_GROUP_COLLAPSED, TEXT_FORMATTING_HERO_BUTTON_COLLAPSED, TEXT_SECTION_PRIMARY_TOOLBAR, TEXT_FORMAT_GROUP_RANK, TEXT_FORMAT_GROUP_COLLAPSED_RANK, TEXT_SECTION_PRIMARY_TOOLBAR_RANK, useEditorToolbar } from '@atlaskit/editor-common/toolbar';
import { Show, ToolbarButtonGroup } from '@atlaskit/editor-toolbar';
import { FormatOptions } from '../types';
import { FormatButton } from './Component';
import { formatOptions } from './utils';
var TextFormattingGroup = function TextFormattingGroup(_ref) {
var children = _ref.children;
var _useEditorToolbar = useEditorToolbar(),
editorAppearance = _useEditorToolbar.editorAppearance;
if (editorAppearance === 'full-page') {
return /*#__PURE__*/React.createElement(Show, {
above: "xl"
}, /*#__PURE__*/React.createElement(ToolbarButtonGroup, null, children));
}
};
var TextFormattingGroupCollapsed = function TextFormattingGroupCollapsed(_ref2) {
var children = _ref2.children;
var _useEditorToolbar2 = useEditorToolbar(),
editorAppearance = _useEditorToolbar2.editorAppearance;
if (editorAppearance === 'full-page') {
return /*#__PURE__*/React.createElement(Show, {
below: "xl"
}, /*#__PURE__*/React.createElement(ToolbarButtonGroup, null, children));
}
return /*#__PURE__*/React.createElement(ToolbarButtonGroup, null, children);
};
export var textFormattingGroupForPrimaryToolbar = function textFormattingGroupForPrimaryToolbar(api) {
return [{
type: TEXT_FORMATTING_GROUP.type,
key: TEXT_FORMATTING_GROUP.key,
parents: [{
type: TEXT_SECTION_PRIMARY_TOOLBAR.type,
key: TEXT_SECTION_PRIMARY_TOOLBAR.key,
rank: TEXT_SECTION_PRIMARY_TOOLBAR_RANK[TEXT_FORMATTING_GROUP.key]
}],
component: function component(_ref3) {
var children = _ref3.children;
return /*#__PURE__*/React.createElement(TextFormattingGroup, null, children);
}
}, {
type: TEXT_FORMATTING_GROUP_COLLAPSED.type,
key: TEXT_FORMATTING_GROUP_COLLAPSED.key,
parents: [{
type: TEXT_SECTION_PRIMARY_TOOLBAR.type,
key: TEXT_SECTION_PRIMARY_TOOLBAR.key,
rank: TEXT_SECTION_PRIMARY_TOOLBAR_RANK[TEXT_FORMATTING_GROUP.key]
}],
component: function component(_ref4) {
var children = _ref4.children;
return /*#__PURE__*/React.createElement(TextFormattingGroupCollapsed, null, children);
}
}, {
type: TEXT_FORMATTING_HERO_BUTTON.type,
key: TEXT_FORMATTING_HERO_BUTTON.key,
parents: [{
type: TEXT_FORMATTING_GROUP.type,
key: TEXT_FORMATTING_GROUP.key,
rank: TEXT_FORMAT_GROUP_RANK[TEXT_FORMATTING_HERO_BUTTON.key]
}],
component: function component(_ref5) {
var parents = _ref5.parents;
var _formatOptions$em = formatOptions().em,
icon = _formatOptions$em.icon,
command = _formatOptions$em.command,
shortcut = _formatOptions$em.shortcut,
title = _formatOptions$em.title;
return /*#__PURE__*/React.createElement(FormatButton, {
api: api,
parents: parents,
icon: icon,
title: title,
shortcut: shortcut,
optionType: FormatOptions.em,
toggleMarkWithAnalyticsCallback: command
});
}
}, {
type: TEXT_FORMATTING_HERO_BUTTON_COLLAPSED.type,
key: TEXT_FORMATTING_HERO_BUTTON_COLLAPSED.key,
parents: [{
type: TEXT_FORMATTING_GROUP_COLLAPSED.type,
key: TEXT_FORMATTING_GROUP_COLLAPSED.key,
rank: TEXT_FORMAT_GROUP_COLLAPSED_RANK[TEXT_FORMATTING_HERO_BUTTON_COLLAPSED.key]
}],
component: function component(_ref6) {
var parents = _ref6.parents;
var _formatOptions$strong = formatOptions().strong,
icon = _formatOptions$strong.icon,
command = _formatOptions$strong.command,
shortcut = _formatOptions$strong.shortcut,
title = _formatOptions$strong.title;
return /*#__PURE__*/React.createElement(FormatButton, {
api: api,
parents: parents,
icon: icon,
title: title,
shortcut: shortcut,
optionType: FormatOptions.strong,
toggleMarkWithAnalyticsCallback: command
});
}
}];
};