@atlaskit/editor-plugin-block-type 5.1.11 → 5.1.13

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 (16) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/cjs/pm-plugins/block-types.js +35 -7
  3. package/dist/cjs/pm-plugins/ui/ToolbarBlockType/blocktype-button.js +3 -0
  4. package/dist/cjs/pm-plugins/ui/ToolbarBlockType/index.js +8 -2
  5. package/dist/cjs/ui/styles.js +2 -2
  6. package/dist/es2019/pm-plugins/block-types.js +35 -7
  7. package/dist/es2019/pm-plugins/ui/ToolbarBlockType/blocktype-button.js +3 -0
  8. package/dist/es2019/pm-plugins/ui/ToolbarBlockType/index.js +8 -2
  9. package/dist/es2019/ui/styles.js +2 -2
  10. package/dist/esm/pm-plugins/block-types.js +35 -7
  11. package/dist/esm/pm-plugins/ui/ToolbarBlockType/blocktype-button.js +3 -0
  12. package/dist/esm/pm-plugins/ui/ToolbarBlockType/index.js +8 -2
  13. package/dist/esm/ui/styles.js +2 -2
  14. package/dist/types/pm-plugins/types.d.ts +1 -0
  15. package/dist/types-ts4.5/pm-plugins/types.d.ts +1 -0
  16. package/package.json +14 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-block-type
2
2
 
3
+ ## 5.1.13
4
+
5
+ ### Patch Changes
6
+
7
+ - [#140066](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/140066)
8
+ [`6f2d7504278cc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6f2d7504278cc) -
9
+ [ux] Update Test styles icons.
10
+ - Updated dependencies
11
+
12
+ ## 5.1.12
13
+
14
+ ### Patch Changes
15
+
16
+ - [#133802](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/133802)
17
+ [`f523489c8b68a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f523489c8b68a) -
18
+ [ux] ED-27217 Clean up experiment platform_editor_element_drag_and_drop_nested
19
+ - Updated dependencies
20
+
3
21
  ## 5.1.11
4
22
 
5
23
  ### Patch Changes
package/dist/cjs/pm-plugins/block-types.js CHANGED
@@ -7,6 +7,13 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.getBlockTypesInDropdown = exports.WRAPPER_BLOCK_TYPES = exports.TEXT_BLOCK_TYPES = exports.PANEL = exports.OTHER = exports.NORMAL_TEXT = exports.HEADING_6 = exports.HEADING_5 = exports.HEADING_4 = exports.HEADING_3 = exports.HEADING_2 = exports.HEADING_1 = exports.HEADINGS_BY_NAME = exports.HEADINGS_BY_LEVEL = exports.FORMATTING_NODE_TYPES = exports.FORMATTING_MARK_TYPES = exports.CODE_BLOCK = exports.BLOCK_QUOTE = exports.ALL_BLOCK_TYPES = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _messages = require("@atlaskit/editor-common/messages");
10
+ var _textHeadingFive = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-five"));
11
+ var _textHeadingFour = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-four"));
12
+ var _textHeadingOne = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-one"));
13
+ var _textHeadingSix = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-six"));
14
+ var _textHeadingThree = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-three"));
15
+ var _textHeadingTwo = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-two"));
16
+ var _text = _interopRequireDefault(require("@atlaskit/icon/core/text"));
10
17
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
11
18
  var _icons = require("./ui/ToolbarBlockType/icons");
12
19
  var NORMAL_TEXT = exports.NORMAL_TEXT = {
@@ -14,7 +21,10 @@ var NORMAL_TEXT = exports.NORMAL_TEXT = {
14
21
  title: _messages.blockTypeMessages.normal,
15
22
  nodeName: 'paragraph',
16
23
  tagName: 'p',
17
- icon: /*#__PURE__*/_react.default.createElement(_icons.Text, null)
24
+ icon: /*#__PURE__*/_react.default.createElement(_text.default, {
25
+ label: ""
26
+ }),
27
+ LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.Text, null)
18
28
  };
19
29
  var HEADING_1 = exports.HEADING_1 = {
20
30
  name: 'heading1',
@@ -22,7 +32,10 @@ var HEADING_1 = exports.HEADING_1 = {
22
32
  nodeName: 'heading',
23
33
  tagName: 'h1',
24
34
  level: 1,
25
- icon: /*#__PURE__*/_react.default.createElement(_icons.H1, null)
35
+ icon: /*#__PURE__*/_react.default.createElement(_textHeadingOne.default, {
36
+ label: ""
37
+ }),
38
+ LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.H1, null)
26
39
  };
27
40
  var HEADING_2 = exports.HEADING_2 = {
28
41
  name: 'heading2',
@@ -30,7 +43,10 @@ var HEADING_2 = exports.HEADING_2 = {
30
43
  nodeName: 'heading',
31
44
  tagName: 'h2',
32
45
  level: 2,
33
- icon: /*#__PURE__*/_react.default.createElement(_icons.H2, null)
46
+ icon: /*#__PURE__*/_react.default.createElement(_textHeadingTwo.default, {
47
+ label: ""
48
+ }),
49
+ LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.H2, null)
34
50
  };
35
51
  var HEADING_3 = exports.HEADING_3 = {
36
52
  name: 'heading3',
@@ -38,7 +54,10 @@ var HEADING_3 = exports.HEADING_3 = {
38
54
  nodeName: 'heading',
39
55
  tagName: 'h3',
40
56
  level: 3,
41
- icon: /*#__PURE__*/_react.default.createElement(_icons.H3, null)
57
+ icon: /*#__PURE__*/_react.default.createElement(_textHeadingThree.default, {
58
+ label: ""
59
+ }),
60
+ LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.H3, null)
42
61
  };
43
62
  var HEADING_4 = exports.HEADING_4 = {
44
63
  name: 'heading4',
@@ -46,7 +65,10 @@ var HEADING_4 = exports.HEADING_4 = {
46
65
  nodeName: 'heading',
47
66
  tagName: 'h4',
48
67
  level: 4,
49
- icon: /*#__PURE__*/_react.default.createElement(_icons.H4, null)
68
+ icon: /*#__PURE__*/_react.default.createElement(_textHeadingFour.default, {
69
+ label: ""
70
+ }),
71
+ LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.H4, null)
50
72
  };
51
73
  var HEADING_5 = exports.HEADING_5 = {
52
74
  name: 'heading5',
@@ -54,7 +76,10 @@ var HEADING_5 = exports.HEADING_5 = {
54
76
  nodeName: 'heading',
55
77
  tagName: 'h5',
56
78
  level: 5,
57
- icon: /*#__PURE__*/_react.default.createElement(_icons.H5, null)
79
+ icon: /*#__PURE__*/_react.default.createElement(_textHeadingFive.default, {
80
+ label: ""
81
+ }),
82
+ LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.H5, null)
58
83
  };
59
84
  var HEADING_6 = exports.HEADING_6 = {
60
85
  name: 'heading6',
@@ -62,7 +87,10 @@ var HEADING_6 = exports.HEADING_6 = {
62
87
  nodeName: 'heading',
63
88
  tagName: 'h6',
64
89
  level: 6,
65
- icon: /*#__PURE__*/_react.default.createElement(_icons.H6, null)
90
+ icon: /*#__PURE__*/_react.default.createElement(_textHeadingSix.default, {
91
+ label: ""
92
+ }),
93
+ LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.H6, null)
66
94
  };
67
95
  var BLOCK_QUOTE = exports.BLOCK_QUOTE = {
68
96
  name: 'blockquote',
package/dist/cjs/pm-plugins/ui/ToolbarBlockType/blocktype-button.js CHANGED
@@ -14,6 +14,7 @@ var _uiMenu = require("@atlaskit/editor-common/ui-menu");
14
14
  var _text = _interopRequireDefault(require("@atlaskit/icon/core/text"));
15
15
  var _textStyle = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/text-style"));
16
16
  var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
17
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
17
18
  var _primitives = require("@atlaskit/primitives");
18
19
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
19
20
  var _blockTypes = require("../../block-types");
@@ -46,6 +47,7 @@ var BlockTypeButton = exports.BlockTypeButton = function BlockTypeButton(props)
46
47
  color: "currentColor",
47
48
  LEGACY_fallbackIcon: _textStyle.default
48
49
  });
50
+ var chevronIconSpacing = props.isSmall && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_4') ? 'spacious' : 'none';
49
51
  return (0, _react2.jsx)(_uiMenu.ToolbarButton, {
50
52
  spacing: props.isReducedSpacing ? 'none' : 'default',
51
53
  selected: props.selected
@@ -67,6 +69,7 @@ var BlockTypeButton = exports.BlockTypeButton = function BlockTypeButton(props)
67
69
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
68
70
  css: _styles.expandIconContainerStyle
69
71
  }, (0, _react2.jsx)(_chevronDown.default, {
72
+ spacing: chevronIconSpacing,
70
73
  label: "",
71
74
  color: "currentColor",
72
75
  LEGACY_margin: "0 0 0 -8px"
package/dist/cjs/pm-plugins/ui/ToolbarBlockType/index.js CHANGED
@@ -19,6 +19,7 @@ var _messages = require("@atlaskit/editor-common/messages");
19
19
  var _styles = require("@atlaskit/editor-common/styles");
20
20
  var _uiMenu = require("@atlaskit/editor-common/ui-menu");
21
21
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
22
+ var _text = _interopRequireDefault(require("@atlaskit/icon/core/text"));
22
23
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
23
24
  var _primitives = require("@atlaskit/primitives");
24
25
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
@@ -85,6 +86,7 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
85
86
  var tagName = blockType.tagName || 'p';
86
87
  var Tag = tagName;
87
88
  var keyMap = (0, _keymaps.findKeymapByDescription)(blockType.title.defaultMessage);
89
+ var icon = (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_4') ? blockType === null || blockType === void 0 ? void 0 : blockType.icon : blockType.LEGACY_icon;
88
90
  var item = {
89
91
  content:
90
92
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -94,7 +96,7 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
94
96
  value: blockType,
95
97
  'aria-label': (0, _keymaps.tooltip)(keyMap, formatMessage(blockType.title)),
96
98
  key: "".concat(blockType.name, "-").concat(index),
97
- elemBefore: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? blockType === null || blockType === void 0 ? void 0 : blockType.icon : undefined,
99
+ elemBefore: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? icon : undefined,
98
100
  elemAfter:
99
101
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
100
102
  (0, _react2.jsx)("div", {
@@ -211,6 +213,10 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
211
213
  }).map(function (blockType) {
212
214
  return blockType.title;
213
215
  });
216
+ var defaultIcon = (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_4') ? (0, _react2.jsx)(_text.default, {
217
+ label: ""
218
+ }) : (0, _react2.jsx)(_icons.Text, null);
219
+ var currentIcon = (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_4') ? currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.icon : currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.LEGACY_icon;
214
220
  if (!this.props.isDisabled && !blockTypesDisabled) {
215
221
  var items = this.createItems();
216
222
  var button = (0, _react2.jsx)(_blocktypeButton.BlockTypeButton, {
@@ -224,7 +230,7 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
224
230
  formatMessage: formatMessage,
225
231
  "aria-expanded": active,
226
232
  blockTypeName: currentBlockType.name,
227
- blockTypeIcon: (currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.icon) || (0, _react2.jsx)(_icons.Text, null)
233
+ blockTypeIcon: currentIcon || defaultIcon
228
234
  });
229
235
  return (0, _react2.jsx)("span", {
230
236
  css: (0, _experiments.editorExperiment)('platform_editor_blockquote_in_text_formatting_menu', true) ?
package/dist/cjs/ui/styles.js CHANGED
@@ -8,11 +8,11 @@ exports.blocktypeStyles = void 0;
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
9
9
  var _react = require("@emotion/react");
10
10
  var _styles = require("@atlaskit/editor-common/styles");
11
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
11
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
12
12
  var _templateObject;
13
13
  /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression */
14
14
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
15
15
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Imports are not safe in an object syntax
16
16
  var blocktypeStyles = exports.blocktypeStyles = function blocktypeStyles(typographyTheme) {
17
- return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t", ";\n\t\t", ";\n\t}\n\n\t", "\n"])), _styles.blockquoteSharedStyles, (0, _styles.headingsSharedStyles)(typographyTheme), (0, _experiments.editorExperiment)('nested-dnd', true) && ".ak-editor-content-area.appearance-full-page .ProseMirror blockquote {\n\t\tpadding-left: ".concat("var(--ds-space-250, 20px)", ";\n\t}\n\n\t/* Don't want extra padding for inline editor (nested) */\n\t.ak-editor-content-area .ak-editor-content-area .ProseMirror blockquote {\n\t\tpadding-left: ", "var(--ds-space-200, 16px)", ";\n\t}"));
17
+ return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t", ";\n\t\t", ";\n\t}\n\n\t", "\n"])), _styles.blockquoteSharedStyles, (0, _styles.headingsSharedStyles)(typographyTheme), (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && ".ak-editor-content-area.appearance-full-page .ProseMirror blockquote {\n\t\tpadding-left: ".concat("var(--ds-space-250, 20px)", ";\n\t}\n\n\t/* Don't want extra padding for inline editor (nested) */\n\t.ak-editor-content-area .ak-editor-content-area .ProseMirror blockquote {\n\t\tpadding-left: ", "var(--ds-space-200, 16px)", ";\n\t}"));
18
18
  };
package/dist/es2019/pm-plugins/block-types.js CHANGED
@@ -1,5 +1,12 @@
1
1
  import React from 'react';
2
2
  import { blockTypeMessages as messages } from '@atlaskit/editor-common/messages';
3
+ import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
4
+ import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
5
+ import TextHeadingOneIcon from '@atlaskit/icon-lab/core/text-heading-one';
6
+ import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
7
+ import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
8
+ import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
9
+ import TextIcon from '@atlaskit/icon/core/text';
3
10
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
4
11
  import { Text, H1, H2, H3, H4, H5, H6 } from './ui/ToolbarBlockType/icons';
5
12
  export const NORMAL_TEXT = {
@@ -7,7 +14,10 @@ export const NORMAL_TEXT = {
7
14
  title: messages.normal,
8
15
  nodeName: 'paragraph',
9
16
  tagName: 'p',
10
- icon: /*#__PURE__*/React.createElement(Text, null)
17
+ icon: /*#__PURE__*/React.createElement(TextIcon, {
18
+ label: ""
19
+ }),
20
+ LEGACY_icon: /*#__PURE__*/React.createElement(Text, null)
11
21
  };
12
22
  export const HEADING_1 = {
13
23
  name: 'heading1',
@@ -15,7 +25,10 @@ export const HEADING_1 = {
15
25
  nodeName: 'heading',
16
26
  tagName: 'h1',
17
27
  level: 1,
18
- icon: /*#__PURE__*/React.createElement(H1, null)
28
+ icon: /*#__PURE__*/React.createElement(TextHeadingOneIcon, {
29
+ label: ""
30
+ }),
31
+ LEGACY_icon: /*#__PURE__*/React.createElement(H1, null)
19
32
  };
20
33
  export const HEADING_2 = {
21
34
  name: 'heading2',
@@ -23,7 +36,10 @@ export const HEADING_2 = {
23
36
  nodeName: 'heading',
24
37
  tagName: 'h2',
25
38
  level: 2,
26
- icon: /*#__PURE__*/React.createElement(H2, null)
39
+ icon: /*#__PURE__*/React.createElement(TextHeadingTwoIcon, {
40
+ label: ""
41
+ }),
42
+ LEGACY_icon: /*#__PURE__*/React.createElement(H2, null)
27
43
  };
28
44
  export const HEADING_3 = {
29
45
  name: 'heading3',
@@ -31,7 +47,10 @@ export const HEADING_3 = {
31
47
  nodeName: 'heading',
32
48
  tagName: 'h3',
33
49
  level: 3,
34
- icon: /*#__PURE__*/React.createElement(H3, null)
50
+ icon: /*#__PURE__*/React.createElement(TextHeadingThreeIcon, {
51
+ label: ""
52
+ }),
53
+ LEGACY_icon: /*#__PURE__*/React.createElement(H3, null)
35
54
  };
36
55
  export const HEADING_4 = {
37
56
  name: 'heading4',
@@ -39,7 +58,10 @@ export const HEADING_4 = {
39
58
  nodeName: 'heading',
40
59
  tagName: 'h4',
41
60
  level: 4,
42
- icon: /*#__PURE__*/React.createElement(H4, null)
61
+ icon: /*#__PURE__*/React.createElement(TextHeadingFourIcon, {
62
+ label: ""
63
+ }),
64
+ LEGACY_icon: /*#__PURE__*/React.createElement(H4, null)
43
65
  };
44
66
  export const HEADING_5 = {
45
67
  name: 'heading5',
@@ -47,7 +69,10 @@ export const HEADING_5 = {
47
69
  nodeName: 'heading',
48
70
  tagName: 'h5',
49
71
  level: 5,
50
- icon: /*#__PURE__*/React.createElement(H5, null)
72
+ icon: /*#__PURE__*/React.createElement(TextHeadingFiveIcon, {
73
+ label: ""
74
+ }),
75
+ LEGACY_icon: /*#__PURE__*/React.createElement(H5, null)
51
76
  };
52
77
  export const HEADING_6 = {
53
78
  name: 'heading6',
@@ -55,7 +80,10 @@ export const HEADING_6 = {
55
80
  nodeName: 'heading',
56
81
  tagName: 'h6',
57
82
  level: 6,
58
- icon: /*#__PURE__*/React.createElement(H6, null)
83
+ icon: /*#__PURE__*/React.createElement(TextHeadingSixIcon, {
84
+ label: ""
85
+ }),
86
+ LEGACY_icon: /*#__PURE__*/React.createElement(H6, null)
59
87
  };
60
88
  export const BLOCK_QUOTE = {
61
89
  name: 'blockquote',
package/dist/es2019/pm-plugins/ui/ToolbarBlockType/blocktype-button.js CHANGED
@@ -13,6 +13,7 @@ import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
13
13
  import TextIcon from '@atlaskit/icon/core/text';
14
14
  import { default as TextStyleIconLegacy } from '@atlaskit/icon/glyph/editor/text-style';
15
15
  import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
16
+ import { fg } from '@atlaskit/platform-feature-flags';
16
17
  import { Box, xcss } from '@atlaskit/primitives';
17
18
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
18
19
  import { NORMAL_TEXT } from '../../block-types';
@@ -38,6 +39,7 @@ export const BlockTypeButton = props => {
38
39
  color: "currentColor",
39
40
  LEGACY_fallbackIcon: TextStyleIconLegacy
40
41
  });
42
+ const chevronIconSpacing = props.isSmall && editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_4') ? 'spacious' : 'none';
41
43
  return jsx(ToolbarButton, {
42
44
  spacing: props.isReducedSpacing ? 'none' : 'default',
43
45
  selected: props.selected
@@ -59,6 +61,7 @@ export const BlockTypeButton = props => {
59
61
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
60
62
  css: expandIconContainerStyle
61
63
  }, jsx(ChevronDownIcon, {
64
+ spacing: chevronIconSpacing,
62
65
  label: "",
63
66
  color: "currentColor",
64
67
  LEGACY_margin: "0 0 0 -8px"
package/dist/es2019/pm-plugins/ui/ToolbarBlockType/index.js CHANGED
@@ -13,6 +13,7 @@ import { toolbarMessages } from '@atlaskit/editor-common/messages';
13
13
  import { separatorStyles, wrapperStyle } from '@atlaskit/editor-common/styles';
14
14
  import { DropdownMenuWithKeyboardNavigation as DropdownMenu } from '@atlaskit/editor-common/ui-menu';
15
15
  import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
16
+ import TextIcon from '@atlaskit/icon/core/text';
16
17
  import { fg } from '@atlaskit/platform-feature-flags';
17
18
  import { Box, xcss } from '@atlaskit/primitives';
18
19
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -73,6 +74,7 @@ class ToolbarBlockType extends React.PureComponent {
73
74
  const tagName = blockType.tagName || 'p';
74
75
  const Tag = tagName;
75
76
  const keyMap = findKeymapByDescription(blockType.title.defaultMessage);
77
+ const icon = fg('platform_editor_controls_patch_4') ? blockType === null || blockType === void 0 ? void 0 : blockType.icon : blockType.LEGACY_icon;
76
78
  const item = {
77
79
  content:
78
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
@@ -82,7 +84,7 @@ class ToolbarBlockType extends React.PureComponent {
82
84
  value: blockType,
83
85
  'aria-label': tooltip(keyMap, formatMessage(blockType.title)),
84
86
  key: `${blockType.name}-${index}`,
85
- elemBefore: editorExperiment('platform_editor_controls', 'variant1') ? blockType === null || blockType === void 0 ? void 0 : blockType.icon : undefined,
87
+ elemBefore: editorExperiment('platform_editor_controls', 'variant1') ? icon : undefined,
86
88
  elemAfter:
87
89
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
88
90
  jsx("div", {
@@ -188,6 +190,10 @@ class ToolbarBlockType extends React.PureComponent {
188
190
  return null;
189
191
  }
190
192
  const blockTypeTitles = availableBlockTypesInDropdown.filter(blockType => blockType.name === currentBlockType.name).map(blockType => blockType.title);
193
+ const defaultIcon = fg('platform_editor_controls_patch_4') ? jsx(TextIcon, {
194
+ label: ""
195
+ }) : jsx(Text, null);
196
+ const currentIcon = fg('platform_editor_controls_patch_4') ? currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.icon : currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.LEGACY_icon;
191
197
  if (!this.props.isDisabled && !blockTypesDisabled) {
192
198
  const items = this.createItems();
193
199
  const button = jsx(BlockTypeButton, {
@@ -201,7 +207,7 @@ class ToolbarBlockType extends React.PureComponent {
201
207
  formatMessage: formatMessage,
202
208
  "aria-expanded": active,
203
209
  blockTypeName: currentBlockType.name,
204
- blockTypeIcon: (currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.icon) || jsx(Text, null)
210
+ blockTypeIcon: currentIcon || defaultIcon
205
211
  });
206
212
  return jsx("span", {
207
213
  css: editorExperiment('platform_editor_blockquote_in_text_formatting_menu', true) ?
package/dist/es2019/ui/styles.js CHANGED
@@ -2,7 +2,7 @@
2
2
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
3
3
  import { css } from '@emotion/react';
4
4
  import { blockquoteSharedStyles, headingsSharedStyles } from '@atlaskit/editor-common/styles';
5
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
5
+ import { fg } from '@atlaskit/platform-feature-flags';
6
6
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Imports are not safe in an object syntax
7
7
  export const blocktypeStyles = typographyTheme => css`
8
8
  .ProseMirror {
@@ -10,7 +10,7 @@ export const blocktypeStyles = typographyTheme => css`
10
10
  ${headingsSharedStyles(typographyTheme)};
11
11
  }
12
12
 
13
- ${editorExperiment('nested-dnd', true) && `.ak-editor-content-area.appearance-full-page .ProseMirror blockquote {
13
+ ${fg('platform_editor_nested_dnd_styles_changes') && `.ak-editor-content-area.appearance-full-page .ProseMirror blockquote {
14
14
  padding-left: ${"var(--ds-space-250, 20px)"};
15
15
  }
16
16
 
package/dist/esm/pm-plugins/block-types.js CHANGED
@@ -1,5 +1,12 @@
1
1
  import React from 'react';
2
2
  import { blockTypeMessages as messages } from '@atlaskit/editor-common/messages';
3
+ import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
4
+ import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
5
+ import TextHeadingOneIcon from '@atlaskit/icon-lab/core/text-heading-one';
6
+ import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
7
+ import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
8
+ import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
9
+ import TextIcon from '@atlaskit/icon/core/text';
3
10
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
4
11
  import { Text, H1, H2, H3, H4, H5, H6 } from './ui/ToolbarBlockType/icons';
5
12
  export var NORMAL_TEXT = {
@@ -7,7 +14,10 @@ export var NORMAL_TEXT = {
7
14
  title: messages.normal,
8
15
  nodeName: 'paragraph',
9
16
  tagName: 'p',
10
- icon: /*#__PURE__*/React.createElement(Text, null)
17
+ icon: /*#__PURE__*/React.createElement(TextIcon, {
18
+ label: ""
19
+ }),
20
+ LEGACY_icon: /*#__PURE__*/React.createElement(Text, null)
11
21
  };
12
22
  export var HEADING_1 = {
13
23
  name: 'heading1',
@@ -15,7 +25,10 @@ export var HEADING_1 = {
15
25
  nodeName: 'heading',
16
26
  tagName: 'h1',
17
27
  level: 1,
18
- icon: /*#__PURE__*/React.createElement(H1, null)
28
+ icon: /*#__PURE__*/React.createElement(TextHeadingOneIcon, {
29
+ label: ""
30
+ }),
31
+ LEGACY_icon: /*#__PURE__*/React.createElement(H1, null)
19
32
  };
20
33
  export var HEADING_2 = {
21
34
  name: 'heading2',
@@ -23,7 +36,10 @@ export var HEADING_2 = {
23
36
  nodeName: 'heading',
24
37
  tagName: 'h2',
25
38
  level: 2,
26
- icon: /*#__PURE__*/React.createElement(H2, null)
39
+ icon: /*#__PURE__*/React.createElement(TextHeadingTwoIcon, {
40
+ label: ""
41
+ }),
42
+ LEGACY_icon: /*#__PURE__*/React.createElement(H2, null)
27
43
  };
28
44
  export var HEADING_3 = {
29
45
  name: 'heading3',
@@ -31,7 +47,10 @@ export var HEADING_3 = {
31
47
  nodeName: 'heading',
32
48
  tagName: 'h3',
33
49
  level: 3,
34
- icon: /*#__PURE__*/React.createElement(H3, null)
50
+ icon: /*#__PURE__*/React.createElement(TextHeadingThreeIcon, {
51
+ label: ""
52
+ }),
53
+ LEGACY_icon: /*#__PURE__*/React.createElement(H3, null)
35
54
  };
36
55
  export var HEADING_4 = {
37
56
  name: 'heading4',
@@ -39,7 +58,10 @@ export var HEADING_4 = {
39
58
  nodeName: 'heading',
40
59
  tagName: 'h4',
41
60
  level: 4,
42
- icon: /*#__PURE__*/React.createElement(H4, null)
61
+ icon: /*#__PURE__*/React.createElement(TextHeadingFourIcon, {
62
+ label: ""
63
+ }),
64
+ LEGACY_icon: /*#__PURE__*/React.createElement(H4, null)
43
65
  };
44
66
  export var HEADING_5 = {
45
67
  name: 'heading5',
@@ -47,7 +69,10 @@ export var HEADING_5 = {
47
69
  nodeName: 'heading',
48
70
  tagName: 'h5',
49
71
  level: 5,
50
- icon: /*#__PURE__*/React.createElement(H5, null)
72
+ icon: /*#__PURE__*/React.createElement(TextHeadingFiveIcon, {
73
+ label: ""
74
+ }),
75
+ LEGACY_icon: /*#__PURE__*/React.createElement(H5, null)
51
76
  };
52
77
  export var HEADING_6 = {
53
78
  name: 'heading6',
@@ -55,7 +80,10 @@ export var HEADING_6 = {
55
80
  nodeName: 'heading',
56
81
  tagName: 'h6',
57
82
  level: 6,
58
- icon: /*#__PURE__*/React.createElement(H6, null)
83
+ icon: /*#__PURE__*/React.createElement(TextHeadingSixIcon, {
84
+ label: ""
85
+ }),
86
+ LEGACY_icon: /*#__PURE__*/React.createElement(H6, null)
59
87
  };
60
88
  export var BLOCK_QUOTE = {
61
89
  name: 'blockquote',
package/dist/esm/pm-plugins/ui/ToolbarBlockType/blocktype-button.js CHANGED
@@ -13,6 +13,7 @@ import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
13
13
  import TextIcon from '@atlaskit/icon/core/text';
14
14
  import { default as TextStyleIconLegacy } from '@atlaskit/icon/glyph/editor/text-style';
15
15
  import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
16
+ import { fg } from '@atlaskit/platform-feature-flags';
16
17
  import { Box, xcss } from '@atlaskit/primitives';
17
18
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
18
19
  import { NORMAL_TEXT } from '../../block-types';
@@ -38,6 +39,7 @@ export var BlockTypeButton = function BlockTypeButton(props) {
38
39
  color: "currentColor",
39
40
  LEGACY_fallbackIcon: TextStyleIconLegacy
40
41
  });
42
+ var chevronIconSpacing = props.isSmall && editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_4') ? 'spacious' : 'none';
41
43
  return jsx(ToolbarButton, {
42
44
  spacing: props.isReducedSpacing ? 'none' : 'default',
43
45
  selected: props.selected
@@ -59,6 +61,7 @@ export var BlockTypeButton = function BlockTypeButton(props) {
59
61
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
60
62
  css: expandIconContainerStyle
61
63
  }, jsx(ChevronDownIcon, {
64
+ spacing: chevronIconSpacing,
62
65
  label: "",
63
66
  color: "currentColor",
64
67
  LEGACY_margin: "0 0 0 -8px"
package/dist/esm/pm-plugins/ui/ToolbarBlockType/index.js CHANGED
@@ -22,6 +22,7 @@ import { toolbarMessages } from '@atlaskit/editor-common/messages';
22
22
  import { separatorStyles, wrapperStyle } from '@atlaskit/editor-common/styles';
23
23
  import { DropdownMenuWithKeyboardNavigation as DropdownMenu } from '@atlaskit/editor-common/ui-menu';
24
24
  import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
25
+ import TextIcon from '@atlaskit/icon/core/text';
25
26
  import { fg } from '@atlaskit/platform-feature-flags';
26
27
  import { Box, xcss } from '@atlaskit/primitives';
27
28
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -81,6 +82,7 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
81
82
  var tagName = blockType.tagName || 'p';
82
83
  var Tag = tagName;
83
84
  var keyMap = findKeymapByDescription(blockType.title.defaultMessage);
85
+ var icon = fg('platform_editor_controls_patch_4') ? blockType === null || blockType === void 0 ? void 0 : blockType.icon : blockType.LEGACY_icon;
84
86
  var item = {
85
87
  content:
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
@@ -90,7 +92,7 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
90
92
  value: blockType,
91
93
  'aria-label': tooltip(keyMap, formatMessage(blockType.title)),
92
94
  key: "".concat(blockType.name, "-").concat(index),
93
- elemBefore: editorExperiment('platform_editor_controls', 'variant1') ? blockType === null || blockType === void 0 ? void 0 : blockType.icon : undefined,
95
+ elemBefore: editorExperiment('platform_editor_controls', 'variant1') ? icon : undefined,
94
96
  elemAfter:
95
97
  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
96
98
  jsx("div", {
@@ -207,6 +209,10 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
207
209
  }).map(function (blockType) {
208
210
  return blockType.title;
209
211
  });
212
+ var defaultIcon = fg('platform_editor_controls_patch_4') ? jsx(TextIcon, {
213
+ label: ""
214
+ }) : jsx(Text, null);
215
+ var currentIcon = fg('platform_editor_controls_patch_4') ? currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.icon : currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.LEGACY_icon;
210
216
  if (!this.props.isDisabled && !blockTypesDisabled) {
211
217
  var items = this.createItems();
212
218
  var button = jsx(BlockTypeButton, {
@@ -220,7 +226,7 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
220
226
  formatMessage: formatMessage,
221
227
  "aria-expanded": active,
222
228
  blockTypeName: currentBlockType.name,
223
- blockTypeIcon: (currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.icon) || jsx(Text, null)
229
+ blockTypeIcon: currentIcon || defaultIcon
224
230
  });
225
231
  return jsx("span", {
226
232
  css: editorExperiment('platform_editor_blockquote_in_text_formatting_menu', true) ?
package/dist/esm/ui/styles.js CHANGED
@@ -4,8 +4,8 @@ var _templateObject;
4
4
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
5
5
  import { css } from '@emotion/react';
6
6
  import { blockquoteSharedStyles, headingsSharedStyles } from '@atlaskit/editor-common/styles';
7
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
7
+ import { fg } from '@atlaskit/platform-feature-flags';
8
8
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Imports are not safe in an object syntax
9
9
  export var blocktypeStyles = function blocktypeStyles(typographyTheme) {
10
- return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", ";\n\t\t", ";\n\t}\n\n\t", "\n"])), blockquoteSharedStyles, headingsSharedStyles(typographyTheme), editorExperiment('nested-dnd', true) && ".ak-editor-content-area.appearance-full-page .ProseMirror blockquote {\n\t\tpadding-left: ".concat("var(--ds-space-250, 20px)", ";\n\t}\n\n\t/* Don't want extra padding for inline editor (nested) */\n\t.ak-editor-content-area .ak-editor-content-area .ProseMirror blockquote {\n\t\tpadding-left: ", "var(--ds-space-200, 16px)", ";\n\t}"));
10
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", ";\n\t\t", ";\n\t}\n\n\t", "\n"])), blockquoteSharedStyles, headingsSharedStyles(typographyTheme), fg('platform_editor_nested_dnd_styles_changes') && ".ak-editor-content-area.appearance-full-page .ProseMirror blockquote {\n\t\tpadding-left: ".concat("var(--ds-space-250, 20px)", ";\n\t}\n\n\t/* Don't want extra padding for inline editor (nested) */\n\t.ak-editor-content-area .ak-editor-content-area .ProseMirror blockquote {\n\t\tpadding-left: ", "var(--ds-space-200, 16px)", ";\n\t}"));
11
11
  };
package/dist/types/pm-plugins/types.d.ts CHANGED
@@ -10,6 +10,7 @@ export interface BlockType {
10
10
  tagName?: string;
11
11
  level?: HeadingLevelsAndNormalText;
12
12
  icon?: ReactElement;
13
+ LEGACY_icon?: ReactElement;
13
14
  }
14
15
  export interface BlockTypeNode {
15
16
  name: AllowedBlockTypes;
package/dist/types-ts4.5/pm-plugins/types.d.ts CHANGED
@@ -10,6 +10,7 @@ export interface BlockType {
10
10
  tagName?: string;
11
11
  level?: HeadingLevelsAndNormalText;
12
12
  icon?: ReactElement;
13
+ LEGACY_icon?: ReactElement;
13
14
  }
14
15
  export interface BlockTypeNode {
15
16
  name: AllowedBlockTypes;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-type",
3
- "version": "5.1.11",
3
+ "version": "5.1.13",
4
4
  "description": "BlockType plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -36,16 +36,17 @@
36
36
  },
37
37
  "dependencies": {
38
38
  "@atlaskit/adf-schema": "^47.6.0",
39
- "@atlaskit/editor-common": "^103.0.0",
39
+ "@atlaskit/editor-common": "^103.6.0",
40
40
  "@atlaskit/editor-plugin-analytics": "^2.2.0",
41
- "@atlaskit/editor-plugin-primary-toolbar": "^3.1.0",
42
- "@atlaskit/editor-plugin-selection-toolbar": "^3.1.0",
41
+ "@atlaskit/editor-plugin-primary-toolbar": "^3.2.0",
42
+ "@atlaskit/editor-plugin-selection-toolbar": "^3.4.0",
43
43
  "@atlaskit/editor-prosemirror": "7.0.0",
44
44
  "@atlaskit/editor-shared-styles": "^3.4.0",
45
45
  "@atlaskit/editor-tables": "^2.9.0",
46
46
  "@atlaskit/icon": "^25.5.0",
47
+ "@atlaskit/icon-lab": "^4.7.0",
47
48
  "@atlaskit/platform-feature-flags": "^1.1.0",
48
- "@atlaskit/primitives": "^14.3.0",
49
+ "@atlaskit/primitives": "^14.4.0",
49
50
  "@atlaskit/prosemirror-input-rules": "^3.3.0",
50
51
  "@atlaskit/theme": "^18.0.0",
51
52
  "@atlaskit/tmp-editor-statsig": "^4.6.0",
@@ -61,8 +62,8 @@
61
62
  "devDependencies": {
62
63
  "@af/visual-regression": "^1.3.0",
63
64
  "@atlaskit/analytics-next": "^11.0.0",
64
- "@atlaskit/editor-plugin-quick-insert": "^2.2.0",
65
- "@atlaskit/editor-plugin-type-ahead": "^2.3.0",
65
+ "@atlaskit/editor-plugin-quick-insert": "^2.3.0",
66
+ "@atlaskit/editor-plugin-type-ahead": "^2.4.0",
66
67
  "@atlaskit/ssr": "^0.4.0",
67
68
  "@atlaskit/visual-regression": "^0.10.0",
68
69
  "@testing-library/react": "^13.4.0",
@@ -110,8 +111,14 @@
110
111
  "platform_editor_toolbar_responsive_fixes": {
111
112
  "type": "boolean"
112
113
  },
114
+ "platform_editor_nested_dnd_styles_changes": {
115
+ "type": "boolean"
116
+ },
113
117
  "platform_editor_comments_toolbar_responsiveness": {
114
118
  "type": "boolean"
119
+ },
120
+ "platform_editor_controls_patch_4": {
121
+ "type": "boolean"
115
122
  }
116
123
  }
117
124
  }