@atlaskit/editor-plugin-block-type 4.0.14 → 4.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/cjs/blockTypePlugin.js +3 -0
  3. package/dist/cjs/pm-plugins/block-types.js +3 -1
  4. package/dist/cjs/pm-plugins/commands/block-type.js +58 -10
  5. package/dist/cjs/pm-plugins/commands/clear-formatting.js +58 -0
  6. package/dist/cjs/pm-plugins/main.js +6 -3
  7. package/dist/cjs/pm-plugins/ui/FloatingToolbarComponent.js +5 -0
  8. package/dist/cjs/pm-plugins/ui/PrimaryToolbarComponent.js +6 -1
  9. package/dist/cjs/pm-plugins/ui/ToolbarBlockType/index.js +82 -45
  10. package/dist/cjs/pm-plugins/ui/ToolbarBlockType/styled.js +15 -1
  11. package/dist/cjs/pm-plugins/utils.js +41 -2
  12. package/dist/es2019/blockTypePlugin.js +4 -1
  13. package/dist/es2019/pm-plugins/block-types.js +2 -0
  14. package/dist/es2019/pm-plugins/commands/block-type.js +49 -0
  15. package/dist/es2019/pm-plugins/commands/clear-formatting.js +50 -0
  16. package/dist/es2019/pm-plugins/main.js +7 -4
  17. package/dist/es2019/pm-plugins/ui/FloatingToolbarComponent.js +5 -0
  18. package/dist/es2019/pm-plugins/ui/PrimaryToolbarComponent.js +6 -1
  19. package/dist/es2019/pm-plugins/ui/ToolbarBlockType/index.js +83 -48
  20. package/dist/es2019/pm-plugins/ui/ToolbarBlockType/styled.js +14 -0
  21. package/dist/es2019/pm-plugins/utils.js +43 -2
  22. package/dist/esm/blockTypePlugin.js +4 -1
  23. package/dist/esm/pm-plugins/block-types.js +2 -0
  24. package/dist/esm/pm-plugins/commands/block-type.js +55 -9
  25. package/dist/esm/pm-plugins/commands/clear-formatting.js +50 -0
  26. package/dist/esm/pm-plugins/main.js +7 -4
  27. package/dist/esm/pm-plugins/ui/FloatingToolbarComponent.js +5 -0
  28. package/dist/esm/pm-plugins/ui/PrimaryToolbarComponent.js +6 -1
  29. package/dist/esm/pm-plugins/ui/ToolbarBlockType/index.js +84 -47
  30. package/dist/esm/pm-plugins/ui/ToolbarBlockType/styled.js +14 -0
  31. package/dist/esm/pm-plugins/utils.js +41 -2
  32. package/dist/types/blockTypePluginType.d.ts +1 -0
  33. package/dist/types/pm-plugins/block-types.d.ts +2 -0
  34. package/dist/types/pm-plugins/commands/block-type.d.ts +1 -0
  35. package/dist/types/pm-plugins/commands/clear-formatting.d.ts +8 -0
  36. package/dist/types/pm-plugins/main.d.ts +2 -7
  37. package/dist/types/pm-plugins/ui/ToolbarBlockType/index.d.ts +1 -0
  38. package/dist/types/pm-plugins/ui/ToolbarBlockType/styled.d.ts +1 -0
  39. package/dist/types/pm-plugins/utils.d.ts +3 -0
  40. package/dist/types-ts4.5/blockTypePluginType.d.ts +1 -0
  41. package/dist/types-ts4.5/pm-plugins/block-types.d.ts +2 -0
  42. package/dist/types-ts4.5/pm-plugins/commands/block-type.d.ts +1 -0
  43. package/dist/types-ts4.5/pm-plugins/commands/clear-formatting.d.ts +8 -0
  44. package/dist/types-ts4.5/pm-plugins/main.d.ts +2 -7
  45. package/dist/types-ts4.5/pm-plugins/ui/ToolbarBlockType/index.d.ts +1 -0
  46. package/dist/types-ts4.5/pm-plugins/ui/ToolbarBlockType/styled.d.ts +1 -0
  47. package/dist/types-ts4.5/pm-plugins/utils.d.ts +3 -0
  48. package/package.json +3 -3
@@ -9,7 +9,7 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
9
9
  import { BLOCK_QUOTE, CODE_BLOCK, HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6, HEADINGS_BY_LEVEL, NORMAL_TEXT, OTHER, PANEL, TEXT_BLOCK_TYPES, WRAPPER_BLOCK_TYPES, getBlockTypesInDropdown } from './block-types';
10
10
  import { setHeadingWithAnalytics, setNormalTextWithAnalytics } from './commands/block-type';
11
11
  import { HEADING_KEYS } from './consts';
12
- import { areBlockTypesDisabled } from './utils';
12
+ import { areBlockTypesDisabled, checkFormattingIsPresent, hasBlockQuoteInOptions } from './utils';
13
13
  var blockTypeForNode = function blockTypeForNode(node, schema) {
14
14
  if (node.type === schema.nodes.heading) {
15
15
  var maybeNode = HEADINGS_BY_LEVEL[node.attrs['level']];
@@ -104,12 +104,14 @@ export var createPlugin = function createPlugin(editorAPI, dispatch, lastNodeMus
104
104
  var availableBlockTypesInDropdown = BLOCK_TYPES_IN_DROPDOWN.filter(function (blockType) {
105
105
  return isBlockTypeSchemaSupported(blockType, state);
106
106
  });
107
+ var formattingIsPresent = hasBlockQuoteInOptions(availableBlockTypesInDropdown) ? checkFormattingIsPresent(state) : undefined;
107
108
  return {
108
109
  currentBlockType: detectBlockType(availableBlockTypesInDropdown, state),
109
110
  blockTypesDisabled: areBlockTypesDisabled(state),
110
111
  availableBlockTypes: availableBlockTypes,
111
112
  availableWrapperBlockTypes: availableWrapperBlockTypes,
112
- availableBlockTypesInDropdown: availableBlockTypesInDropdown
113
+ availableBlockTypesInDropdown: availableBlockTypesInDropdown,
114
+ formattingIsPresent: formattingIsPresent
113
115
  };
114
116
  },
115
117
  // Ignored via go/ees005
@@ -117,9 +119,10 @@ export var createPlugin = function createPlugin(editorAPI, dispatch, lastNodeMus
117
119
  apply: function apply(_tr, oldPluginState, _oldState, newState) {
118
120
  var newPluginState = _objectSpread(_objectSpread({}, oldPluginState), {}, {
119
121
  currentBlockType: detectBlockType(oldPluginState.availableBlockTypesInDropdown, newState),
120
- blockTypesDisabled: areBlockTypesDisabled(newState)
122
+ blockTypesDisabled: areBlockTypesDisabled(newState),
123
+ formattingIsPresent: hasBlockQuoteInOptions(oldPluginState.availableBlockTypesInDropdown) ? checkFormattingIsPresent(newState) : undefined
121
124
  });
122
- if (newPluginState.currentBlockType !== oldPluginState.currentBlockType || newPluginState.blockTypesDisabled !== oldPluginState.blockTypesDisabled) {
125
+ if (newPluginState.currentBlockType !== oldPluginState.currentBlockType || newPluginState.blockTypesDisabled !== oldPluginState.blockTypesDisabled || newPluginState.formattingIsPresent !== oldPluginState.formattingIsPresent) {
123
126
  dispatch(pluginKey, newPluginState);
124
127
  }
125
128
  return newPluginState;
@@ -20,6 +20,10 @@ export function FloatingToolbarComponent(_ref) {
20
20
  var _api$core2, _api$blockType2;
21
21
  return api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(api === null || api === void 0 || (_api$blockType2 = api.blockType) === null || _api$blockType2 === void 0 || (_api$blockType2 = _api$blockType2.commands) === null || _api$blockType2 === void 0 ? void 0 : _api$blockType2.insertBlockQuote(INPUT_METHOD.TOOLBAR));
22
22
  }, [api]);
23
+ var clearFormatting = useCallback(function () {
24
+ var _api$core3, _api$blockType3;
25
+ return api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(api === null || api === void 0 || (_api$blockType3 = api.blockType) === null || _api$blockType3 === void 0 || (_api$blockType3 = _api$blockType3.commands) === null || _api$blockType3 === void 0 ? void 0 : _api$blockType3.clearFormatting());
26
+ }, [api]);
23
27
  return /*#__PURE__*/React.createElement(ToolbarBlockType, {
24
28
  isSmall: FloatingToolbarSettings.isSmall,
25
29
  isDisabled: FloatingToolbarSettings.disabled,
@@ -30,6 +34,7 @@ export function FloatingToolbarComponent(_ref) {
30
34
  ,
31
35
  pluginState: blockTypeState,
32
36
  wrapBlockQuote: wrapBlockQuote,
37
+ clearFormatting: clearFormatting,
33
38
  shouldUseDefaultRole: FloatingToolbarSettings.shouldUseDefaultRole,
34
39
  api: api
35
40
  });
@@ -21,12 +21,17 @@ export function PrimaryToolbarComponent(_ref) {
21
21
  var _api$core2, _api$blockType2;
22
22
  return api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(api === null || api === void 0 || (_api$blockType2 = api.blockType) === null || _api$blockType2 === void 0 || (_api$blockType2 = _api$blockType2.commands) === null || _api$blockType2 === void 0 ? void 0 : _api$blockType2.insertBlockQuote(INPUT_METHOD.TOOLBAR));
23
23
  };
24
+ var clearFormatting = function clearFormatting() {
25
+ var _api$core3, _api$blockType3;
26
+ return api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(api === null || api === void 0 || (_api$blockType3 = api.blockType) === null || _api$blockType3 === void 0 || (_api$blockType3 = _api$blockType3.commands) === null || _api$blockType3 === void 0 ? void 0 : _api$blockType3.clearFormatting());
27
+ };
24
28
  return /*#__PURE__*/React.createElement(ToolbarBlockType, {
25
29
  isSmall: isSmall,
26
30
  isDisabled: disabled,
27
31
  isReducedSpacing: isToolbarReducedSpacing,
28
32
  setTextLevel: boundSetBlockType,
29
- wrapBlockQuote: wrapBlockQuote
33
+ wrapBlockQuote: wrapBlockQuote,
34
+ clearFormatting: clearFormatting
30
35
  // Ignored via go/ees005
31
36
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
32
37
  ,
@@ -17,13 +17,16 @@ import React from 'react';
17
17
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
18
18
  import { jsx } from '@emotion/react';
19
19
  import { injectIntl } from 'react-intl-next';
20
- import { findKeymapByDescription, getAriaKeyshortcuts, tooltip } from '@atlaskit/editor-common/keymaps';
20
+ import { findKeymapByDescription, tooltip, clearFormatting } from '@atlaskit/editor-common/keymaps';
21
+ import { toolbarMessages } from '@atlaskit/editor-common/messages';
21
22
  import { separatorStyles, wrapperStyle } from '@atlaskit/editor-common/styles';
22
23
  import { DropdownMenuWithKeyboardNavigation as DropdownMenu } from '@atlaskit/editor-common/ui-menu';
23
24
  import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
25
+ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
24
26
  import { ThemeMutationObserver } from '@atlaskit/tokens';
27
+ import { NORMAL_TEXT } from '../../block-types';
25
28
  import { BlockTypeButton } from './blocktype-button';
26
- import { blockTypeMenuItemStyle, keyboardShortcut, keyboardShortcutSelect } from './styled';
29
+ import { blockTypeMenuItemStyle, keyboardShortcut, keyboardShortcutSelect, floatingToolbarWrapperStyle } from './styled';
27
30
  // eslint-disable-next-line @repo/internal/react/no-class-components
28
31
  var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
29
32
  function ToolbarBlockType() {
@@ -65,22 +68,21 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
65
68
  var formatMessage = _this.props.intl.formatMessage;
66
69
  var _this$props$pluginSta = _this.props.pluginState,
67
70
  currentBlockType = _this$props$pluginSta.currentBlockType,
68
- availableBlockTypesInDropdown = _this$props$pluginSta.availableBlockTypesInDropdown;
71
+ availableBlockTypesInDropdown = _this$props$pluginSta.availableBlockTypesInDropdown,
72
+ formattingIsPresent = _this$props$pluginSta.formattingIsPresent;
69
73
  var items = availableBlockTypesInDropdown.map(function (blockType, index) {
70
74
  var isActive = currentBlockType === blockType;
71
75
  var tagName = blockType.tagName || 'p';
72
76
  var Tag = tagName;
73
77
  var keyMap = findKeymapByDescription(blockType.title.defaultMessage);
74
- return {
78
+ var item = {
75
79
  content:
76
80
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
77
81
  jsx("div", {
78
82
  css: blockTypeMenuItemStyle(tagName, isActive, _this.state.typographyTheme)
79
83
  }, jsx(Tag, null, formatMessage(blockType.title))),
80
84
  value: blockType,
81
- label: formatMessage(blockType.title),
82
85
  'aria-label': tooltip(keyMap, formatMessage(blockType.title)),
83
- keyShortcuts: getAriaKeyshortcuts(keyMap),
84
86
  key: "".concat(blockType.name, "-").concat(index),
85
87
  elemAfter:
86
88
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -89,7 +91,32 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
89
91
  }, tooltip(keyMap)),
90
92
  isActive: isActive
91
93
  };
94
+ return item;
92
95
  });
96
+ if (availableBlockTypesInDropdown.map(function (blockType) {
97
+ return blockType.name;
98
+ }).includes('blockquote')) {
99
+ var clearFormattingItem = {
100
+ content: jsx("div", null, jsx("p", null, toolbarMessages.clearFormatting.defaultMessage)),
101
+ value: {
102
+ name: 'clearFormatting'
103
+ },
104
+ 'aria-label': tooltip(clearFormatting, toolbarMessages.clearFormatting.defaultMessage),
105
+ key: 'clear-formatting',
106
+ elemAfter:
107
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
108
+ jsx("div", {
109
+ css: [keyboardShortcut]
110
+ }, tooltip(clearFormatting)),
111
+ isActive: false,
112
+ isDisabled: currentBlockType === NORMAL_TEXT && !formattingIsPresent
113
+ };
114
+ return [{
115
+ items: items
116
+ }, {
117
+ items: [clearFormattingItem]
118
+ }];
119
+ }
93
120
  return [{
94
121
  items: items
95
122
  }];
@@ -102,8 +129,12 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
102
129
  if (blockType.name === 'blockquote') {
103
130
  _this.props.wrapBlockQuote(blockType.name);
104
131
  } else {
105
- var fromBlockQuote = _this.props.pluginState.currentBlockType.name === 'blockquote';
106
- _this.props.setTextLevel(blockType.name, fromBlockQuote);
132
+ if (blockType.name === 'clearFormatting') {
133
+ _this.props.clearFormatting();
134
+ } else {
135
+ var fromBlockQuote = _this.props.pluginState.currentBlockType.name === 'blockquote';
136
+ _this.props.setTextLevel(blockType.name, fromBlockQuote);
137
+ }
107
138
  }
108
139
  if (shouldCloseMenu) {
109
140
  _this.setState(_objectSpread(_objectSpread({}, _this.state), {}, {
@@ -171,47 +202,53 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
171
202
  });
172
203
  if (!this.props.isDisabled && !blockTypesDisabled) {
173
204
  var items = this.createItems();
174
- return (
205
+ return jsx("span", {
206
+ css: editorExperiment('platform_editor_blockquote_in_text_formatting_menu', true) ?
207
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
208
+ [wrapperStyle, floatingToolbarWrapperStyle] :
175
209
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
176
- jsx("span", {
177
- css: wrapperStyle
178
- }, jsx(DropdownMenu, {
179
- items: items,
180
- onOpenChange: this.onOpenChange,
181
- onItemActivated: this.handleSelectBlockType,
182
- isOpen: active,
183
- mountTo: popupsMountPoint,
184
- boundariesElement: popupsBoundariesElement,
185
- scrollableElement: popupsScrollableElement,
186
- zIndex: akEditorMenuZIndex,
187
- fitHeight: 360,
188
- fitWidth: 106,
189
- shouldUseDefaultRole: shouldUseDefaultRole,
190
- shouldFocusFirstItem: function shouldFocusFirstItem() {
191
- if (isOpenedByKeyboard) {
192
- // eslint-disable-next-line @repo/internal/react/no-set-state-inside-render
193
- _this3.setState(_objectSpread(_objectSpread({}, _this3.state), {}, {
194
- isOpenedByKeyboard: false
195
- }));
196
- }
197
- return isOpenedByKeyboard;
210
+ wrapperStyle
211
+ }, jsx(DropdownMenu, {
212
+ items: items,
213
+ onOpenChange: this.onOpenChange,
214
+ onItemActivated: this.handleSelectBlockType,
215
+ isOpen: active,
216
+ mountTo: popupsMountPoint,
217
+ boundariesElement: popupsBoundariesElement,
218
+ scrollableElement: popupsScrollableElement,
219
+ zIndex: akEditorMenuZIndex,
220
+ fitHeight: 360,
221
+ fitWidth: 106,
222
+ section: {
223
+ hasSeparator: true
224
+ },
225
+ shouldUseDefaultRole: shouldUseDefaultRole
226
+ // hasSeparator={true}
227
+ ,
228
+ shouldFocusFirstItem: function shouldFocusFirstItem() {
229
+ if (isOpenedByKeyboard) {
230
+ // eslint-disable-next-line @repo/internal/react/no-set-state-inside-render
231
+ _this3.setState(_objectSpread(_objectSpread({}, _this3.state), {}, {
232
+ isOpenedByKeyboard: false
233
+ }));
198
234
  }
199
- }, jsx(BlockTypeButton, {
200
- isSmall: isSmall,
201
- isReducedSpacing: isReducedSpacing,
202
- selected: active,
203
- disabled: false,
204
- title: blockTypeTitles[0],
205
- onClick: this.handleTriggerClick,
206
- onKeyDown: this.handleTriggerByKeyboard,
207
- formatMessage: formatMessage,
208
- "aria-expanded": active,
209
- blockTypeName: currentBlockType.name
210
- })), !(api !== null && api !== void 0 && api.primaryToolbar) && jsx("span", {
211
- // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
212
- css: separatorStyles
213
- }))
214
- );
235
+ return isOpenedByKeyboard;
236
+ }
237
+ }, jsx(BlockTypeButton, {
238
+ isSmall: isSmall,
239
+ isReducedSpacing: isReducedSpacing,
240
+ selected: active,
241
+ disabled: false,
242
+ title: blockTypeTitles[0],
243
+ onClick: this.handleTriggerClick,
244
+ onKeyDown: this.handleTriggerByKeyboard,
245
+ formatMessage: formatMessage,
246
+ "aria-expanded": active,
247
+ blockTypeName: currentBlockType.name
248
+ })), !(api !== null && api !== void 0 && api.primaryToolbar) && jsx("span", {
249
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
250
+ css: separatorStyles
251
+ }));
215
252
  }
216
253
  return (
217
254
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -19,6 +19,12 @@ export var blockTypeMenuItemStyle = function blockTypeMenuItemStyle(tagName, sel
19
19
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
20
20
  'h1, h2, h3, h4, h5, h6': {
21
21
  marginTop: 0
22
+ },
23
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
24
+ blockquote: {
25
+ paddingTop: 0,
26
+ paddingBottom: 0,
27
+ marginTop: 0
22
28
  }
23
29
  }
24
30
  },
@@ -47,4 +53,12 @@ export var wrapperSmallStyle = css({
47
53
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
48
54
  export var expandIconWrapperStyle = css({
49
55
  marginLeft: "var(--ds-space-negative-100, -8px)"
56
+ });
57
+
58
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
59
+ export var floatingToolbarWrapperStyle = css({
60
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
61
+ "[data-role='droplistContent']": {
62
+ maxHeight: '90vh'
63
+ }
50
64
  });
@@ -1,7 +1,8 @@
1
+ import { anyMarkActive } from '@atlaskit/editor-common/mark';
1
2
  import { createRule, createWrappingJoinRule } from '@atlaskit/editor-common/utils';
2
3
  import { fg } from '@atlaskit/platform-feature-flags';
3
4
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
4
- import { WRAPPER_BLOCK_TYPES } from './block-types';
5
+ import { WRAPPER_BLOCK_TYPES, FORMATTING_NODE_TYPES, FORMATTING_MARK_TYPES } from './block-types';
5
6
  export var isNodeAWrappingBlockNode = function isNodeAWrappingBlockNode(node) {
6
7
  if (!node) {
7
8
  return false;
@@ -110,4 +111,42 @@ export function areBlockTypesDisabled(state) {
110
111
  return nodesTypes.filter(function (type) {
111
112
  return type !== panel;
112
113
  }).length > 0;
113
- }
114
+ }
115
+ var blockStylingIsPresent = function blockStylingIsPresent(state) {
116
+ var _state$selection3 = state.selection,
117
+ from = _state$selection3.from,
118
+ to = _state$selection3.to;
119
+ var isBlockStyling = false;
120
+ state.doc.nodesBetween(from, to, function (node) {
121
+ if (FORMATTING_NODE_TYPES.indexOf(node.type.name) !== -1) {
122
+ isBlockStyling = true;
123
+ return false;
124
+ }
125
+ return true;
126
+ });
127
+ return isBlockStyling;
128
+ };
129
+ var marksArePresent = function marksArePresent(state) {
130
+ var activeMarkTypes = FORMATTING_MARK_TYPES.filter(function (mark) {
131
+ if (!!state.schema.marks[mark]) {
132
+ var _state$selection4 = state.selection,
133
+ $from = _state$selection4.$from,
134
+ empty = _state$selection4.empty;
135
+ var marks = state.schema.marks;
136
+ if (empty) {
137
+ return !!marks[mark].isInSet(state.storedMarks || $from.marks());
138
+ }
139
+ return anyMarkActive(state, marks[mark]);
140
+ }
141
+ return false;
142
+ });
143
+ return activeMarkTypes.length > 0;
144
+ };
145
+ export var checkFormattingIsPresent = function checkFormattingIsPresent(state) {
146
+ return marksArePresent(state) || blockStylingIsPresent(state);
147
+ };
148
+ export var hasBlockQuoteInOptions = function hasBlockQuoteInOptions(dropdownOptions) {
149
+ return !!dropdownOptions.find(function (blockType) {
150
+ return blockType.name === 'blockquote';
151
+ });
152
+ };
@@ -15,5 +15,6 @@ export type BlockTypePlugin = NextEditorPlugin<'blockType', {
15
15
  commands: {
16
16
  setTextLevel: (level: TextBlockTypes, inputMethod: InputMethod, fromBlockQuote?: boolean) => EditorCommand;
17
17
  insertBlockQuote: (inputMethod: InputMethod) => EditorCommand;
18
+ clearFormatting: () => EditorCommand;
18
19
  };
19
20
  }>;
@@ -12,6 +12,8 @@ export declare const PANEL: BlockType;
12
12
  export declare const OTHER: BlockType;
13
13
  export declare const TEXT_BLOCK_TYPES: BlockType[];
14
14
  export type TextBlockTypes = 'normal' | 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6';
15
+ export declare const FORMATTING_NODE_TYPES: string[];
16
+ export declare const FORMATTING_MARK_TYPES: string[];
15
17
  export declare const WRAPPER_BLOCK_TYPES: BlockType[];
16
18
  export declare const ALL_BLOCK_TYPES: BlockType[];
17
19
  export declare const getBlockTypesInDropdown: (includeBlockQuoteAsTextstyleOption?: boolean) => BlockType[];
@@ -6,6 +6,7 @@ export declare function setBlockType(name: TextBlockTypes): EditorCommand;
6
6
  export declare function setHeading(level: HeadingLevelsAndNormalText, fromBlockQuote?: boolean): EditorCommand;
7
7
  export declare function setBlockTypeWithAnalytics(name: TextBlockTypes, inputMethod: InputMethod, editorAnalyticsApi: EditorAnalyticsAPI | undefined, fromBlockQuote?: boolean): EditorCommand;
8
8
  export declare function setNormalText(fromBlockQuote?: boolean): EditorCommand;
9
+ export declare function clearFormatting(): EditorCommand;
9
10
  export declare function setNormalTextWithAnalytics(inputMethod: InputMethod, editorAnalyticsApi: EditorAnalyticsAPI | undefined, fromBlockQuote?: boolean): EditorCommand;
10
11
  export declare const setHeadingWithAnalytics: (newHeadingLevel: HeadingLevelsAndNormalText, inputMethod: InputMethod, editorAnalyticsApi: EditorAnalyticsAPI | undefined, fromBlockQuote?: boolean) => EditorCommand;
11
12
  /**
@@ -0,0 +1,8 @@
1
+ import type { Node, NodeType, Schema } from '@atlaskit/editor-prosemirror/model';
2
+ import type { Transaction } from '@atlaskit/editor-prosemirror/state';
3
+ import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
4
+ export declare const FORMATTING_NODE_TYPES: string[];
5
+ export declare const FORMATTING_MARK_TYPES: string[];
6
+ export declare const formatTypes: Record<string, string>;
7
+ export declare const cellSelectionNodesBetween: (selection: CellSelection, doc: Node, f: (node: Node, pos: number, parent: Node | null, index: number) => void | boolean, startPos?: number) => void;
8
+ export declare function clearNodeFormattingOnSelection(schema: Schema, tr: Transaction, formattedNodeType: NodeType, nodeName: string, formattingCleared: string[]): (node: Node, pos: number) => boolean;
@@ -11,13 +11,8 @@ export type BlockTypeState = {
11
11
  availableBlockTypes: BlockType[];
12
12
  availableWrapperBlockTypes: BlockType[];
13
13
  availableBlockTypesInDropdown: BlockType[];
14
+ formattingIsPresent?: boolean;
14
15
  };
15
16
  export declare const pluginKey: PluginKey<BlockTypeState>;
16
- export declare const createPlugin: (editorAPI: ExtractInjectionAPI<BlockTypePlugin> | undefined, dispatch: (eventName: string | PluginKey, data: any) => void, lastNodeMustBeParagraph?: boolean, includeBlockQuoteAsTextstyleOption?: boolean) => SafePlugin<{
17
- currentBlockType: BlockType;
18
- blockTypesDisabled: boolean;
19
- availableBlockTypes: BlockType[];
20
- availableWrapperBlockTypes: BlockType[];
21
- availableBlockTypesInDropdown: BlockType[];
22
- }>;
17
+ export declare const createPlugin: (editorAPI: ExtractInjectionAPI<BlockTypePlugin> | undefined, dispatch: (eventName: string | PluginKey, data: any) => void, lastNodeMustBeParagraph?: boolean, includeBlockQuoteAsTextstyleOption?: boolean) => SafePlugin<BlockTypeState>;
23
18
  export declare const handleBlockQuoteDND: (view: EditorView, event: DragEvent, slice: Slice) => boolean;
@@ -26,6 +26,7 @@ export interface Props {
26
26
  editorView?: EditorView;
27
27
  setTextLevel: (type: TextBlockTypes, fromBlockQuote?: boolean) => void;
28
28
  wrapBlockQuote: (type: TextBlockTypes) => void;
29
+ clearFormatting: () => void;
29
30
  shouldUseDefaultRole?: boolean;
30
31
  api: ExtractInjectionAPI<BlockTypePlugin> | undefined;
31
32
  }
@@ -3,3 +3,4 @@ export declare const keyboardShortcut: import("@emotion/react").SerializedStyles
3
3
  export declare const keyboardShortcutSelect: import("@emotion/react").SerializedStyles;
4
4
  export declare const wrapperSmallStyle: import("@emotion/react").SerializedStyles;
5
5
  export declare const expandIconWrapperStyle: import("@emotion/react").SerializedStyles;
6
+ export declare const floatingToolbarWrapperStyle: import("@emotion/react").SerializedStyles;
@@ -1,6 +1,7 @@
1
1
  import type { InputRuleWrapper } from '@atlaskit/editor-common/types';
2
2
  import type { NodeType, Node as PMNode } from '@atlaskit/editor-prosemirror/model';
3
3
  import type { EditorState } from '@atlaskit/editor-prosemirror/state';
4
+ import type { BlockType } from './types';
4
5
  export declare const isNodeAWrappingBlockNode: (node?: PMNode | null) => boolean;
5
6
  export declare const createJoinNodesRule: (match: RegExp, nodeType: NodeType) => InputRuleWrapper;
6
7
  type WrappingTextRuleProps = {
@@ -13,4 +14,6 @@ export declare const createWrappingTextBlockRule: ({ match, nodeType, getAttrs,
13
14
  * Function will check if changing block types: Paragraph, Heading is enabled.
14
15
  */
15
16
  export declare function areBlockTypesDisabled(state: EditorState): boolean;
17
+ export declare const checkFormattingIsPresent: (state: EditorState) => boolean;
18
+ export declare const hasBlockQuoteInOptions: (dropdownOptions: BlockType[]) => boolean;
16
19
  export {};
@@ -18,5 +18,6 @@ export type BlockTypePlugin = NextEditorPlugin<'blockType', {
18
18
  commands: {
19
19
  setTextLevel: (level: TextBlockTypes, inputMethod: InputMethod, fromBlockQuote?: boolean) => EditorCommand;
20
20
  insertBlockQuote: (inputMethod: InputMethod) => EditorCommand;
21
+ clearFormatting: () => EditorCommand;
21
22
  };
22
23
  }>;
@@ -12,6 +12,8 @@ export declare const PANEL: BlockType;
12
12
  export declare const OTHER: BlockType;
13
13
  export declare const TEXT_BLOCK_TYPES: BlockType[];
14
14
  export type TextBlockTypes = 'normal' | 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6';
15
+ export declare const FORMATTING_NODE_TYPES: string[];
16
+ export declare const FORMATTING_MARK_TYPES: string[];
15
17
  export declare const WRAPPER_BLOCK_TYPES: BlockType[];
16
18
  export declare const ALL_BLOCK_TYPES: BlockType[];
17
19
  export declare const getBlockTypesInDropdown: (includeBlockQuoteAsTextstyleOption?: boolean) => BlockType[];
@@ -6,6 +6,7 @@ export declare function setBlockType(name: TextBlockTypes): EditorCommand;
6
6
  export declare function setHeading(level: HeadingLevelsAndNormalText, fromBlockQuote?: boolean): EditorCommand;
7
7
  export declare function setBlockTypeWithAnalytics(name: TextBlockTypes, inputMethod: InputMethod, editorAnalyticsApi: EditorAnalyticsAPI | undefined, fromBlockQuote?: boolean): EditorCommand;
8
8
  export declare function setNormalText(fromBlockQuote?: boolean): EditorCommand;
9
+ export declare function clearFormatting(): EditorCommand;
9
10
  export declare function setNormalTextWithAnalytics(inputMethod: InputMethod, editorAnalyticsApi: EditorAnalyticsAPI | undefined, fromBlockQuote?: boolean): EditorCommand;
10
11
  export declare const setHeadingWithAnalytics: (newHeadingLevel: HeadingLevelsAndNormalText, inputMethod: InputMethod, editorAnalyticsApi: EditorAnalyticsAPI | undefined, fromBlockQuote?: boolean) => EditorCommand;
11
12
  /**
@@ -0,0 +1,8 @@
1
+ import type { Node, NodeType, Schema } from '@atlaskit/editor-prosemirror/model';
2
+ import type { Transaction } from '@atlaskit/editor-prosemirror/state';
3
+ import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
4
+ export declare const FORMATTING_NODE_TYPES: string[];
5
+ export declare const FORMATTING_MARK_TYPES: string[];
6
+ export declare const formatTypes: Record<string, string>;
7
+ export declare const cellSelectionNodesBetween: (selection: CellSelection, doc: Node, f: (node: Node, pos: number, parent: Node | null, index: number) => void | boolean, startPos?: number) => void;
8
+ export declare function clearNodeFormattingOnSelection(schema: Schema, tr: Transaction, formattedNodeType: NodeType, nodeName: string, formattingCleared: string[]): (node: Node, pos: number) => boolean;
@@ -11,13 +11,8 @@ export type BlockTypeState = {
11
11
  availableBlockTypes: BlockType[];
12
12
  availableWrapperBlockTypes: BlockType[];
13
13
  availableBlockTypesInDropdown: BlockType[];
14
+ formattingIsPresent?: boolean;
14
15
  };
15
16
  export declare const pluginKey: PluginKey<BlockTypeState>;
16
- export declare const createPlugin: (editorAPI: ExtractInjectionAPI<BlockTypePlugin> | undefined, dispatch: (eventName: string | PluginKey, data: any) => void, lastNodeMustBeParagraph?: boolean, includeBlockQuoteAsTextstyleOption?: boolean) => SafePlugin<{
17
- currentBlockType: BlockType;
18
- blockTypesDisabled: boolean;
19
- availableBlockTypes: BlockType[];
20
- availableWrapperBlockTypes: BlockType[];
21
- availableBlockTypesInDropdown: BlockType[];
22
- }>;
17
+ export declare const createPlugin: (editorAPI: ExtractInjectionAPI<BlockTypePlugin> | undefined, dispatch: (eventName: string | PluginKey, data: any) => void, lastNodeMustBeParagraph?: boolean, includeBlockQuoteAsTextstyleOption?: boolean) => SafePlugin<BlockTypeState>;
23
18
  export declare const handleBlockQuoteDND: (view: EditorView, event: DragEvent, slice: Slice) => boolean;
@@ -26,6 +26,7 @@ export interface Props {
26
26
  editorView?: EditorView;
27
27
  setTextLevel: (type: TextBlockTypes, fromBlockQuote?: boolean) => void;
28
28
  wrapBlockQuote: (type: TextBlockTypes) => void;
29
+ clearFormatting: () => void;
29
30
  shouldUseDefaultRole?: boolean;
30
31
  api: ExtractInjectionAPI<BlockTypePlugin> | undefined;
31
32
  }
@@ -3,3 +3,4 @@ export declare const keyboardShortcut: import("@emotion/react").SerializedStyles
3
3
  export declare const keyboardShortcutSelect: import("@emotion/react").SerializedStyles;
4
4
  export declare const wrapperSmallStyle: import("@emotion/react").SerializedStyles;
5
5
  export declare const expandIconWrapperStyle: import("@emotion/react").SerializedStyles;
6
+ export declare const floatingToolbarWrapperStyle: import("@emotion/react").SerializedStyles;
@@ -1,6 +1,7 @@
1
1
  import type { InputRuleWrapper } from '@atlaskit/editor-common/types';
2
2
  import type { NodeType, Node as PMNode } from '@atlaskit/editor-prosemirror/model';
3
3
  import type { EditorState } from '@atlaskit/editor-prosemirror/state';
4
+ import type { BlockType } from './types';
4
5
  export declare const isNodeAWrappingBlockNode: (node?: PMNode | null) => boolean;
5
6
  export declare const createJoinNodesRule: (match: RegExp, nodeType: NodeType) => InputRuleWrapper;
6
7
  type WrappingTextRuleProps = {
@@ -13,4 +14,6 @@ export declare const createWrappingTextBlockRule: ({ match, nodeType, getAttrs,
13
14
  * Function will check if changing block types: Paragraph, Heading is enabled.
14
15
  */
15
16
  export declare function areBlockTypesDisabled(state: EditorState): boolean;
17
+ export declare const checkFormattingIsPresent: (state: EditorState) => boolean;
18
+ export declare const hasBlockQuoteInOptions: (dropdownOptions: BlockType[]) => boolean;
16
19
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-type",
3
- "version": "4.0.14",
3
+ "version": "4.1.1",
4
4
  "description": "BlockType plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -34,7 +34,7 @@
34
34
  },
35
35
  "dependencies": {
36
36
  "@atlaskit/adf-schema": "^46.1.0",
37
- "@atlaskit/editor-common": "^97.3.0",
37
+ "@atlaskit/editor-common": "^98.0.0",
38
38
  "@atlaskit/editor-plugin-analytics": "^1.10.0",
39
39
  "@atlaskit/editor-plugin-primary-toolbar": "^2.1.0",
40
40
  "@atlaskit/editor-prosemirror": "6.2.1",
@@ -45,7 +45,7 @@
45
45
  "@atlaskit/primitives": "^13.3.0",
46
46
  "@atlaskit/prosemirror-input-rules": "^3.2.0",
47
47
  "@atlaskit/theme": "^14.0.0",
48
- "@atlaskit/tmp-editor-statsig": "^2.30.0",
48
+ "@atlaskit/tmp-editor-statsig": "^2.31.0",
49
49
  "@atlaskit/tokens": "^2.5.0",
50
50
  "@babel/runtime": "^7.0.0",
51
51
  "@emotion/react": "^11.7.1"