@atlaskit/editor-plugin-block-type 12.0.0 → 12.0.2

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 (36) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/cjs/blockTypePlugin.js +1 -1
  3. package/dist/cjs/pm-plugins/block-types.js +29 -10
  4. package/dist/cjs/pm-plugins/main.js +6 -0
  5. package/dist/cjs/pm-plugins/ui/ToolbarBlockType/HeadingButton.js +6 -0
  6. package/dist/cjs/pm-plugins/ui/ToolbarBlockType/TextStylesMenuButton.js +12 -3
  7. package/dist/cjs/pm-plugins/ui/ToolbarBlockType/blocktype-button.js +1 -1
  8. package/dist/cjs/pm-plugins/ui/ToolbarBlockType/index.js +3 -2
  9. package/dist/cjs/pm-plugins/ui/toolbar-components.js +6 -3
  10. package/dist/es2019/blockTypePlugin.js +1 -1
  11. package/dist/es2019/pm-plugins/block-types.js +28 -7
  12. package/dist/es2019/pm-plugins/main.js +5 -1
  13. package/dist/es2019/pm-plugins/ui/ToolbarBlockType/HeadingButton.js +6 -0
  14. package/dist/es2019/pm-plugins/ui/ToolbarBlockType/TextStylesMenuButton.js +11 -2
  15. package/dist/es2019/pm-plugins/ui/ToolbarBlockType/blocktype-button.js +1 -1
  16. package/dist/es2019/pm-plugins/ui/ToolbarBlockType/index.js +4 -1
  17. package/dist/es2019/pm-plugins/ui/toolbar-components.js +6 -3
  18. package/dist/esm/blockTypePlugin.js +1 -1
  19. package/dist/esm/pm-plugins/block-types.js +29 -10
  20. package/dist/esm/pm-plugins/main.js +7 -1
  21. package/dist/esm/pm-plugins/ui/ToolbarBlockType/HeadingButton.js +6 -0
  22. package/dist/esm/pm-plugins/ui/ToolbarBlockType/TextStylesMenuButton.js +12 -3
  23. package/dist/esm/pm-plugins/ui/ToolbarBlockType/blocktype-button.js +1 -1
  24. package/dist/esm/pm-plugins/ui/ToolbarBlockType/index.js +3 -2
  25. package/dist/esm/pm-plugins/ui/toolbar-components.js +6 -3
  26. package/dist/types/pm-plugins/block-types.d.ts +5 -2
  27. package/dist/types/pm-plugins/types.d.ts +1 -0
  28. package/dist/types/pm-plugins/ui/ToolbarBlockType/TextStylesMenuButton.d.ts +2 -1
  29. package/dist/types/pm-plugins/ui/ToolbarBlockType/index.d.ts +3 -3
  30. package/dist/types/pm-plugins/ui/toolbar-components.d.ts +1 -1
  31. package/dist/types-ts4.5/pm-plugins/block-types.d.ts +5 -2
  32. package/dist/types-ts4.5/pm-plugins/types.d.ts +1 -0
  33. package/dist/types-ts4.5/pm-plugins/ui/ToolbarBlockType/TextStylesMenuButton.d.ts +2 -1
  34. package/dist/types-ts4.5/pm-plugins/ui/ToolbarBlockType/index.d.ts +3 -3
  35. package/dist/types-ts4.5/pm-plugins/ui/toolbar-components.d.ts +1 -1
  36. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/editor-plugin-block-type
2
2
 
3
+ ## 12.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`bf1f23f4a76d0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/bf1f23f4a76d0) -
8
+ Add 'small text' as a menu dropdown item in the editor, non functional. Also adds a new universal
9
+ preset config option to support feature.
10
+ - Updated dependencies
11
+
12
+ ## 12.0.1
13
+
14
+ ### Patch Changes
15
+
16
+ - Updated dependencies
17
+
3
18
  ## 12.0.0
4
19
 
5
20
  ### Patch Changes
@@ -131,7 +131,7 @@ var blockTypePlugin = exports.blockTypePlugin = function blockTypePlugin(_ref3)
131
131
  };
132
132
  if (isToolbarAIFCEnabled) {
133
133
  var _api$toolbar;
134
- api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents((0, _toolbarComponents.getToolbarComponents)(api));
134
+ api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents((0, _toolbarComponents.getToolbarComponents)(api, options === null || options === void 0 ? void 0 : options.allowFontSize));
135
135
  } else {
136
136
  var _api$primaryToolbar;
137
137
  api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.toolbarBlockTypesWithRank = 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;
7
+ exports.toolbarBlockTypesWithRank = exports.getBlockTypesInDropdown = exports.WRAPPER_BLOCK_TYPES = exports.TEXT_BLOCK_TYPES = exports.SMALL_TEXT = 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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
9
  var _react = _interopRequireDefault(require("react"));
10
10
  var _messages = require("@atlaskit/editor-common/messages");
@@ -17,7 +17,7 @@ var _textHeadingSix = _interopRequireDefault(require("@atlaskit/icon-lab/core/te
17
17
  var _textHeadingThree = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-three"));
18
18
  var _textHeadingTwo = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-two"));
19
19
  var _text = _interopRequireDefault(require("@atlaskit/icon/core/text"));
20
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
20
+ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
21
21
  var _icons = require("./ui/ToolbarBlockType/icons");
22
22
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
23
23
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -31,6 +31,16 @@ var NORMAL_TEXT = exports.NORMAL_TEXT = {
31
31
  }),
32
32
  LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.Text, null)
33
33
  };
34
+ var SMALL_TEXT = exports.SMALL_TEXT = {
35
+ name: 'smallText',
36
+ title: _messages.blockTypeMessages.smallText,
37
+ nodeName: 'paragraph',
38
+ markName: 'fontSize',
39
+ icon: /*#__PURE__*/_react.default.createElement(_text.default, {
40
+ label: ""
41
+ }),
42
+ LEGACY_icon: /*#__PURE__*/_react.default.createElement(_icons.Text, null)
43
+ };
34
44
  var HEADING_1 = exports.HEADING_1 = {
35
45
  name: 'heading1',
36
46
  title: _messages.blockTypeMessages.heading1,
@@ -118,7 +128,7 @@ var OTHER = exports.OTHER = {
118
128
  title: _messages.blockTypeMessages.other,
119
129
  nodeName: ''
120
130
  };
121
- var TEXT_BLOCK_TYPES = exports.TEXT_BLOCK_TYPES = [NORMAL_TEXT, HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6];
131
+ var TEXT_BLOCK_TYPES = exports.TEXT_BLOCK_TYPES = [NORMAL_TEXT, SMALL_TEXT, HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6];
122
132
  var ToolbarBlockTypes = /*#__PURE__*/function (ToolbarBlockTypes) {
123
133
  ToolbarBlockTypes["normal"] = "normal";
124
134
  ToolbarBlockTypes["heading1"] = "heading1";
@@ -130,8 +140,9 @@ var ToolbarBlockTypes = /*#__PURE__*/function (ToolbarBlockTypes) {
130
140
  ToolbarBlockTypes["blockquote"] = "blockquote";
131
141
  return ToolbarBlockTypes;
132
142
  }(ToolbarBlockTypes || {});
133
- var toolbarBlockTypesWithRank = exports.toolbarBlockTypesWithRank = function toolbarBlockTypesWithRank() {
134
- return {
143
+ var toolbarBlockTypesWithRank = exports.toolbarBlockTypesWithRank = function toolbarBlockTypesWithRank(_ref) {
144
+ var allowFontSize = _ref.allowFontSize;
145
+ return _objectSpread(_objectSpread({
135
146
  normal: _objectSpread(_objectSpread({}, NORMAL_TEXT), {}, {
136
147
  icon: /*#__PURE__*/_react.default.createElement(_editorToolbar.TextIcon, {
137
148
  size: "small",
@@ -139,7 +150,17 @@ var toolbarBlockTypesWithRank = exports.toolbarBlockTypesWithRank = function too
139
150
  }),
140
151
  toolbarRank: _toolbar.TEXT_STYLES_MENU_SECTION_RANK[_toolbar.NORMAL_TEXT_MENU_ITEM.key],
141
152
  toolbarKey: _toolbar.NORMAL_TEXT_MENU_ITEM.key
142
- }),
153
+ })
154
+ }, allowFontSize && (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true) && {
155
+ smallText: _objectSpread(_objectSpread({}, SMALL_TEXT), {}, {
156
+ icon: /*#__PURE__*/_react.default.createElement(_text.default, {
157
+ size: "small",
158
+ label: ""
159
+ }),
160
+ toolbarRank: _toolbar.TEXT_STYLES_MENU_SECTION_RANK[_toolbar.SMALL_TEXT_MENU_ITEM.key],
161
+ toolbarKey: _toolbar.SMALL_TEXT_MENU_ITEM.key
162
+ })
163
+ }), {}, {
143
164
  heading1: _objectSpread(_objectSpread({}, HEADING_1), {}, {
144
165
  icon: /*#__PURE__*/_react.default.createElement(_editorToolbar.HeadingOneIcon, {
145
166
  size: "small",
@@ -196,16 +217,14 @@ var toolbarBlockTypesWithRank = exports.toolbarBlockTypesWithRank = function too
196
217
  toolbarRank: _toolbar.TEXT_STYLES_MENU_SECTION_RANK[_toolbar.BLOCK_QUOTE_MENU_ITEM.key],
197
218
  toolbarKey: _toolbar.BLOCK_QUOTE_MENU_ITEM.key
198
219
  })
199
- };
220
+ });
200
221
  };
201
222
  var FORMATTING_NODE_TYPES = exports.FORMATTING_NODE_TYPES = ['heading', 'blockquote'];
202
223
  var FORMATTING_MARK_TYPES = exports.FORMATTING_MARK_TYPES = ['em', 'code', 'strike', 'strong', 'underline', 'textColor', 'subsup', 'backgroundColor'];
203
224
  var WRAPPER_BLOCK_TYPES = exports.WRAPPER_BLOCK_TYPES = [BLOCK_QUOTE, CODE_BLOCK, PANEL];
204
225
  var ALL_BLOCK_TYPES = exports.ALL_BLOCK_TYPES = TEXT_BLOCK_TYPES.concat(WRAPPER_BLOCK_TYPES);
205
226
  var getBlockTypesInDropdown = exports.getBlockTypesInDropdown = function getBlockTypesInDropdown(includeBlockQuoteAsTextstyleOption) {
206
- return (0, _experiments.editorExperiment)('platform_editor_blockquote_in_text_formatting_menu', true, {
207
- exposure: true
208
- }) && includeBlockQuoteAsTextstyleOption ? [].concat(TEXT_BLOCK_TYPES, [BLOCK_QUOTE]) : TEXT_BLOCK_TYPES;
227
+ return includeBlockQuoteAsTextstyleOption ? [].concat(TEXT_BLOCK_TYPES, [BLOCK_QUOTE]) : TEXT_BLOCK_TYPES;
209
228
  };
210
229
  var HEADINGS_BY_LEVEL = exports.HEADINGS_BY_LEVEL = TEXT_BLOCK_TYPES.reduce(function (acc, blockType) {
211
230
  if (blockType.level && blockType.nodeName === 'heading') {
@@ -24,6 +24,10 @@ var blockTypeForNode = function blockTypeForNode(node, schema) {
24
24
  if (maybeNode) {
25
25
  return maybeNode;
26
26
  }
27
+ } else if (node.marks.some(function (m) {
28
+ return m.type.name === 'fontSize' && m.attrs.fontSize === 'small';
29
+ }) && (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true)) {
30
+ return _blockTypes.SMALL_TEXT;
27
31
  } else if (node.type === schema.nodes.paragraph) {
28
32
  return _blockTypes.NORMAL_TEXT;
29
33
  } else if (node.type === schema.nodes.blockquote) {
@@ -42,6 +46,8 @@ var isBlockTypeSchemaSupported = function isBlockTypeSchemaSupported(blockType,
42
46
  case _blockTypes.HEADING_5:
43
47
  case _blockTypes.HEADING_6:
44
48
  return !!state.schema.nodes.heading;
49
+ case _blockTypes.SMALL_TEXT:
50
+ return !!state.schema.marks.fontSize && (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true);
45
51
  case _blockTypes.BLOCK_QUOTE:
46
52
  return !!state.schema.nodes.blockquote;
47
53
  case _blockTypes.CODE_BLOCK:
@@ -85,6 +85,7 @@ var HeadingText = function HeadingText(_ref) {
85
85
  };
86
86
  var headingSizeStylesMap = {
87
87
  normal: "_11c8fhey",
88
+ smallText: "_11c8fhey",
88
89
  heading1: "_11c812ln",
89
90
  heading2: "_11c810sd",
90
91
  heading3: "_11c81af2",
@@ -94,6 +95,11 @@ var headingSizeStylesMap = {
94
95
  };
95
96
  var shortcuts = {
96
97
  normal: _keymaps.setNormalText,
98
+ smallText: {
99
+ description: '',
100
+ mac: '',
101
+ windows: ''
102
+ },
97
103
  heading1: _keymaps.toggleHeading1,
98
104
  heading2: _keymaps.toggleHeading2,
99
105
  heading3: _keymaps.toggleHeading3,
@@ -25,14 +25,17 @@ var usePluginState = function usePluginState(api) {
25
25
  };
26
26
  var TextStylesMenuButton = exports.TextStylesMenuButton = function TextStylesMenuButton(_ref) {
27
27
  var _Object$values$find;
28
- var api = _ref.api,
28
+ var allowFontSize = _ref.allowFontSize,
29
+ api = _ref.api,
29
30
  children = _ref.children;
30
31
  var _useIntl = (0, _reactIntlNext.useIntl)(),
31
32
  formatMessage = _useIntl.formatMessage;
32
33
  var _usePluginState = usePluginState(api),
33
34
  blockTypesDisabled = _usePluginState.blockTypesDisabled,
34
35
  currentBlockType = _usePluginState.currentBlockType;
35
- var blockTypes = (0, _blockTypes.toolbarBlockTypesWithRank)();
36
+ var blockTypes = (0, _blockTypes.toolbarBlockTypesWithRank)({
37
+ allowFontSize: allowFontSize
38
+ });
36
39
  var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
37
40
  editorAppearance = _useEditorToolbar.editorAppearance;
38
41
  var CurrentIcon = (_Object$values$find = Object.values(blockTypes).find(function (blockType) {
@@ -62,6 +65,9 @@ var TextStylesMenuButton = exports.TextStylesMenuButton = function TextStylesMen
62
65
  iconBefore: TriggerIcon,
63
66
  tooltipComponent: /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarTooltip, {
64
67
  content: formatMessage(_messages.toolbarMessages.textStylesTooltip)
68
+ }),
69
+ label: formatMessage(_messages.toolbarMessages.textStyles, {
70
+ blockTypeName: currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.name
65
71
  })
66
72
  }, children);
67
73
  }
@@ -69,6 +75,9 @@ var TextStylesMenuButton = exports.TextStylesMenuButton = function TextStylesMen
69
75
  content: formatMessage(_messages.toolbarMessages.textStylesTooltip)
70
76
  }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownMenu, {
71
77
  isDisabled: blockTypesDisabled,
72
- iconBefore: TriggerIcon
78
+ iconBefore: TriggerIcon,
79
+ label: formatMessage(_messages.toolbarMessages.textStyles, {
80
+ blockTypeName: currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.name
81
+ })
73
82
  }, children));
74
83
  };
@@ -22,7 +22,7 @@ var _styled = require("./styled");
22
22
  * @jsx jsx
23
23
  */
24
24
 
25
- // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
25
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
26
26
 
27
27
  // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
28
28
 
@@ -299,5 +299,6 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
299
299
  );
300
300
  }
301
301
  }]);
302
- }(_react.default.PureComponent);
303
- var _default = exports.default = (0, _reactIntlNext.injectIntl)(ToolbarBlockType);
302
+ }(_react.default.PureComponent); // eslint-disable-next-line @typescript-eslint/ban-types
303
+ var _default_1 = (0, _reactIntlNext.injectIntl)(ToolbarBlockType);
304
+ var _default = exports.default = _default_1;
@@ -11,7 +11,7 @@ var _blockTypes = require("../block-types");
11
11
  var _HeadingButton = require("./ToolbarBlockType/HeadingButton");
12
12
  var _QuoteButton = require("./ToolbarBlockType/QuoteButton");
13
13
  var _TextStylesMenuButton = require("./ToolbarBlockType/TextStylesMenuButton");
14
- var getToolbarComponents = exports.getToolbarComponents = function getToolbarComponents(api) {
14
+ var getToolbarComponents = exports.getToolbarComponents = function getToolbarComponents(api, allowFontSize) {
15
15
  var toolbarComponents = [{
16
16
  type: _toolbar.TEXT_STYLES_GROUP.type,
17
17
  key: _toolbar.TEXT_STYLES_GROUP.key,
@@ -35,7 +35,8 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
35
35
  component: function component(_ref) {
36
36
  var children = _ref.children;
37
37
  return /*#__PURE__*/_react.default.createElement(_TextStylesMenuButton.TextStylesMenuButton, {
38
- api: api
38
+ api: api,
39
+ allowFontSize: allowFontSize
39
40
  }, children);
40
41
  }
41
42
  }, {
@@ -51,7 +52,9 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
51
52
  rank: _toolbar.TEXT_COLLAPSED_MENU_RANK[_toolbar.TEXT_STYLES_MENU_SECTION.key]
52
53
  }]
53
54
  }];
54
- Object.values((0, _blockTypes.toolbarBlockTypesWithRank)()).forEach(function (blockType) {
55
+ Object.values((0, _blockTypes.toolbarBlockTypesWithRank)({
56
+ allowFontSize: allowFontSize
57
+ })).forEach(function (blockType) {
55
58
  if (blockType.toolbarKey) {
56
59
  var menuItem = {
57
60
  type: 'menu-item',
@@ -120,7 +120,7 @@ const blockTypePlugin = ({
120
120
  };
121
121
  if (isToolbarAIFCEnabled) {
122
122
  var _api$toolbar;
123
- api === null || api === void 0 ? void 0 : (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.registerComponents(getToolbarComponents(api));
123
+ api === null || api === void 0 ? void 0 : (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.registerComponents(getToolbarComponents(api, options === null || options === void 0 ? void 0 : options.allowFontSize));
124
124
  } else {
125
125
  var _api$primaryToolbar;
126
126
  api === null || api === void 0 ? void 0 : (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 ? void 0 : _api$primaryToolbar.actions.registerComponent({
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { blockTypeMessages as messages } from '@atlaskit/editor-common/messages';
3
- import { BLOCK_QUOTE_MENU_ITEM, HEADING_1_MENU_ITEM, HEADING_2_MENU_ITEM, HEADING_3_MENU_ITEM, HEADING_4_MENU_ITEM, HEADING_5_MENU_ITEM, HEADING_6_MENU_ITEM, NORMAL_TEXT_MENU_ITEM, TEXT_STYLES_MENU_SECTION_RANK } from '@atlaskit/editor-common/toolbar';
3
+ import { BLOCK_QUOTE_MENU_ITEM, HEADING_1_MENU_ITEM, HEADING_2_MENU_ITEM, HEADING_3_MENU_ITEM, HEADING_4_MENU_ITEM, HEADING_5_MENU_ITEM, HEADING_6_MENU_ITEM, NORMAL_TEXT_MENU_ITEM, SMALL_TEXT_MENU_ITEM, TEXT_STYLES_MENU_SECTION_RANK } from '@atlaskit/editor-common/toolbar';
4
4
  import { TextIcon as EditorToolbarTextIcon, QuoteIcon, HeadingOneIcon, HeadingTwoIcon, HeadingThreeIcon, HeadingFourIcon, HeadingFiveIcon, HeadingSixIcon } from '@atlaskit/editor-toolbar';
5
5
  import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
6
6
  import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
@@ -9,7 +9,7 @@ import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
9
9
  import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
10
10
  import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
11
11
  import TextIcon from '@atlaskit/icon/core/text';
12
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
12
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
13
  import { Text, H1, H2, H3, H4, H5, H6 } from './ui/ToolbarBlockType/icons';
14
14
  export const NORMAL_TEXT = {
15
15
  name: 'normal',
@@ -21,6 +21,16 @@ export const NORMAL_TEXT = {
21
21
  }),
22
22
  LEGACY_icon: /*#__PURE__*/React.createElement(Text, null)
23
23
  };
24
+ export const SMALL_TEXT = {
25
+ name: 'smallText',
26
+ title: messages.smallText,
27
+ nodeName: 'paragraph',
28
+ markName: 'fontSize',
29
+ icon: /*#__PURE__*/React.createElement(TextIcon, {
30
+ label: ""
31
+ }),
32
+ LEGACY_icon: /*#__PURE__*/React.createElement(Text, null)
33
+ };
24
34
  export const HEADING_1 = {
25
35
  name: 'heading1',
26
36
  title: messages.heading1,
@@ -108,7 +118,7 @@ export const OTHER = {
108
118
  title: messages.other,
109
119
  nodeName: ''
110
120
  };
111
- export const TEXT_BLOCK_TYPES = [NORMAL_TEXT, HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6];
121
+ export const TEXT_BLOCK_TYPES = [NORMAL_TEXT, SMALL_TEXT, HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6];
112
122
  var ToolbarBlockTypes = /*#__PURE__*/function (ToolbarBlockTypes) {
113
123
  ToolbarBlockTypes["normal"] = "normal";
114
124
  ToolbarBlockTypes["heading1"] = "heading1";
@@ -120,7 +130,9 @@ var ToolbarBlockTypes = /*#__PURE__*/function (ToolbarBlockTypes) {
120
130
  ToolbarBlockTypes["blockquote"] = "blockquote";
121
131
  return ToolbarBlockTypes;
122
132
  }(ToolbarBlockTypes || {});
123
- export const toolbarBlockTypesWithRank = () => ({
133
+ export const toolbarBlockTypesWithRank = ({
134
+ allowFontSize
135
+ }) => ({
124
136
  normal: {
125
137
  ...NORMAL_TEXT,
126
138
  icon: /*#__PURE__*/React.createElement(EditorToolbarTextIcon, {
@@ -130,6 +142,17 @@ export const toolbarBlockTypesWithRank = () => ({
130
142
  toolbarRank: TEXT_STYLES_MENU_SECTION_RANK[NORMAL_TEXT_MENU_ITEM.key],
131
143
  toolbarKey: NORMAL_TEXT_MENU_ITEM.key
132
144
  },
145
+ ...(allowFontSize && expValEquals('platform_editor_small_font_size', 'isEnabled', true) && {
146
+ smallText: {
147
+ ...SMALL_TEXT,
148
+ icon: /*#__PURE__*/React.createElement(TextIcon, {
149
+ size: "small",
150
+ label: ""
151
+ }),
152
+ toolbarRank: TEXT_STYLES_MENU_SECTION_RANK[SMALL_TEXT_MENU_ITEM.key],
153
+ toolbarKey: SMALL_TEXT_MENU_ITEM.key
154
+ }
155
+ }),
133
156
  heading1: {
134
157
  ...HEADING_1,
135
158
  icon: /*#__PURE__*/React.createElement(HeadingOneIcon, {
@@ -199,9 +222,7 @@ export const FORMATTING_MARK_TYPES = ['em', 'code', 'strike', 'strong', 'underli
199
222
  export const WRAPPER_BLOCK_TYPES = [BLOCK_QUOTE, CODE_BLOCK, PANEL];
200
223
  export const ALL_BLOCK_TYPES = TEXT_BLOCK_TYPES.concat(WRAPPER_BLOCK_TYPES);
201
224
  export const getBlockTypesInDropdown = includeBlockQuoteAsTextstyleOption => {
202
- return editorExperiment('platform_editor_blockquote_in_text_formatting_menu', true, {
203
- exposure: true
204
- }) && includeBlockQuoteAsTextstyleOption ? [...TEXT_BLOCK_TYPES, BLOCK_QUOTE] : TEXT_BLOCK_TYPES;
225
+ return includeBlockQuoteAsTextstyleOption ? [...TEXT_BLOCK_TYPES, BLOCK_QUOTE] : TEXT_BLOCK_TYPES;
205
226
  };
206
227
  export const HEADINGS_BY_LEVEL = TEXT_BLOCK_TYPES.reduce((acc, blockType) => {
207
228
  if (blockType.level && blockType.nodeName === 'heading') {
@@ -4,7 +4,7 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
4
4
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
5
5
  import { fg } from '@atlaskit/platform-feature-flags';
6
6
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
7
- 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';
7
+ 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, SMALL_TEXT } from './block-types';
8
8
  import { setHeadingWithAnalytics, setNormalTextWithAnalytics } from './commands/block-type';
9
9
  import { HEADING_KEYS, HEADING_NUMPAD_KEYS } from './consts';
10
10
  import { areBlockTypesDisabled, checkFormattingIsPresent, hasBlockQuoteInOptions } from './utils';
@@ -14,6 +14,8 @@ const blockTypeForNode = (node, schema) => {
14
14
  if (maybeNode) {
15
15
  return maybeNode;
16
16
  }
17
+ } else if (node.marks.some(m => m.type.name === 'fontSize' && m.attrs.fontSize === 'small') && expValEquals('platform_editor_small_font_size', 'isEnabled', true)) {
18
+ return SMALL_TEXT;
17
19
  } else if (node.type === schema.nodes.paragraph) {
18
20
  return NORMAL_TEXT;
19
21
  } else if (node.type === schema.nodes.blockquote) {
@@ -32,6 +34,8 @@ const isBlockTypeSchemaSupported = (blockType, state) => {
32
34
  case HEADING_5:
33
35
  case HEADING_6:
34
36
  return !!state.schema.nodes.heading;
37
+ case SMALL_TEXT:
38
+ return !!state.schema.marks.fontSize && expValEquals('platform_editor_small_font_size', 'isEnabled', true);
35
39
  case BLOCK_QUOTE:
36
40
  return !!state.schema.nodes.blockquote;
37
41
  case CODE_BLOCK:
@@ -78,6 +78,7 @@ const HeadingText = ({
78
78
  };
79
79
  const headingSizeStylesMap = {
80
80
  normal: "_11c8fhey",
81
+ smallText: "_11c8fhey",
81
82
  heading1: "_11c812ln",
82
83
  heading2: "_11c810sd",
83
84
  heading3: "_11c81af2",
@@ -87,6 +88,11 @@ const headingSizeStylesMap = {
87
88
  };
88
89
  const shortcuts = {
89
90
  normal: setNormalText,
91
+ smallText: {
92
+ description: '',
93
+ mac: '',
94
+ windows: ''
95
+ },
90
96
  heading1: toggleHeading1,
91
97
  heading2: toggleHeading2,
92
98
  heading3: toggleHeading3,
@@ -16,6 +16,7 @@ const usePluginState = api => {
16
16
  });
17
17
  };
18
18
  export const TextStylesMenuButton = ({
19
+ allowFontSize,
19
20
  api,
20
21
  children
21
22
  }) => {
@@ -27,7 +28,9 @@ export const TextStylesMenuButton = ({
27
28
  blockTypesDisabled,
28
29
  currentBlockType
29
30
  } = usePluginState(api);
30
- const blockTypes = toolbarBlockTypesWithRank();
31
+ const blockTypes = toolbarBlockTypesWithRank({
32
+ allowFontSize
33
+ });
31
34
  const {
32
35
  editorAppearance
33
36
  } = useEditorToolbar();
@@ -56,6 +59,9 @@ export const TextStylesMenuButton = ({
56
59
  iconBefore: TriggerIcon,
57
60
  tooltipComponent: /*#__PURE__*/React.createElement(ToolbarTooltip, {
58
61
  content: formatMessage(toolbarMessages.textStylesTooltip)
62
+ }),
63
+ label: formatMessage(toolbarMessages.textStyles, {
64
+ blockTypeName: currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.name
59
65
  })
60
66
  }, children);
61
67
  }
@@ -63,6 +69,9 @@ export const TextStylesMenuButton = ({
63
69
  content: formatMessage(toolbarMessages.textStylesTooltip)
64
70
  }, /*#__PURE__*/React.createElement(ToolbarDropdownMenu, {
65
71
  isDisabled: blockTypesDisabled,
66
- iconBefore: TriggerIcon
72
+ iconBefore: TriggerIcon,
73
+ label: formatMessage(toolbarMessages.textStyles, {
74
+ blockTypeName: currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.name
75
+ })
67
76
  }, children));
68
77
  };
@@ -4,7 +4,7 @@
4
4
  */
5
5
  import React from 'react';
6
6
 
7
- // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
8
8
  import { jsx } from '@emotion/react';
9
9
  import { FormattedMessage } from 'react-intl-next';
10
10
  import { toolbarMessages } from '@atlaskit/editor-common/messages';
@@ -270,4 +270,7 @@ class ToolbarBlockType extends React.PureComponent {
270
270
  );
271
271
  }
272
272
  }
273
- export default injectIntl(ToolbarBlockType);
273
+
274
+ // eslint-disable-next-line @typescript-eslint/ban-types
275
+ const _default_1 = injectIntl(ToolbarBlockType);
276
+ export default _default_1;
@@ -4,7 +4,7 @@ import { toolbarBlockTypesWithRank } from '../block-types';
4
4
  import { HeadingButton } from './ToolbarBlockType/HeadingButton';
5
5
  import { QuoteButton } from './ToolbarBlockType/QuoteButton';
6
6
  import { TextStylesMenuButton } from './ToolbarBlockType/TextStylesMenuButton';
7
- export const getToolbarComponents = api => {
7
+ export const getToolbarComponents = (api, allowFontSize) => {
8
8
  const toolbarComponents = [{
9
9
  type: TEXT_STYLES_GROUP.type,
10
10
  key: TEXT_STYLES_GROUP.key,
@@ -28,7 +28,8 @@ export const getToolbarComponents = api => {
28
28
  component: ({
29
29
  children
30
30
  }) => /*#__PURE__*/React.createElement(TextStylesMenuButton, {
31
- api: api
31
+ api: api,
32
+ allowFontSize: allowFontSize
32
33
  }, children)
33
34
  }, {
34
35
  type: TEXT_STYLES_MENU_SECTION.type,
@@ -43,7 +44,9 @@ export const getToolbarComponents = api => {
43
44
  rank: TEXT_COLLAPSED_MENU_RANK[TEXT_STYLES_MENU_SECTION.key]
44
45
  }]
45
46
  }];
46
- Object.values(toolbarBlockTypesWithRank()).forEach(blockType => {
47
+ Object.values(toolbarBlockTypesWithRank({
48
+ allowFontSize
49
+ })).forEach(blockType => {
47
50
  if (blockType.toolbarKey) {
48
51
  const menuItem = {
49
52
  type: 'menu-item',
@@ -124,7 +124,7 @@ var blockTypePlugin = function blockTypePlugin(_ref3) {
124
124
  };
125
125
  if (isToolbarAIFCEnabled) {
126
126
  var _api$toolbar;
127
- api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents(getToolbarComponents(api));
127
+ api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents(getToolbarComponents(api, options === null || options === void 0 ? void 0 : options.allowFontSize));
128
128
  } else {
129
129
  var _api$primaryToolbar;
130
130
  api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
@@ -3,7 +3,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
3
3
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
4
  import React from 'react';
5
5
  import { blockTypeMessages as messages } from '@atlaskit/editor-common/messages';
6
- import { BLOCK_QUOTE_MENU_ITEM, HEADING_1_MENU_ITEM, HEADING_2_MENU_ITEM, HEADING_3_MENU_ITEM, HEADING_4_MENU_ITEM, HEADING_5_MENU_ITEM, HEADING_6_MENU_ITEM, NORMAL_TEXT_MENU_ITEM, TEXT_STYLES_MENU_SECTION_RANK } from '@atlaskit/editor-common/toolbar';
6
+ import { BLOCK_QUOTE_MENU_ITEM, HEADING_1_MENU_ITEM, HEADING_2_MENU_ITEM, HEADING_3_MENU_ITEM, HEADING_4_MENU_ITEM, HEADING_5_MENU_ITEM, HEADING_6_MENU_ITEM, NORMAL_TEXT_MENU_ITEM, SMALL_TEXT_MENU_ITEM, TEXT_STYLES_MENU_SECTION_RANK } from '@atlaskit/editor-common/toolbar';
7
7
  import { TextIcon as EditorToolbarTextIcon, QuoteIcon, HeadingOneIcon, HeadingTwoIcon, HeadingThreeIcon, HeadingFourIcon, HeadingFiveIcon, HeadingSixIcon } from '@atlaskit/editor-toolbar';
8
8
  import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
9
9
  import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
@@ -12,7 +12,7 @@ import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
12
12
  import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
13
13
  import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
14
14
  import TextIcon from '@atlaskit/icon/core/text';
15
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
15
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
16
16
  import { Text, H1, H2, H3, H4, H5, H6 } from './ui/ToolbarBlockType/icons';
17
17
  export var NORMAL_TEXT = {
18
18
  name: 'normal',
@@ -24,6 +24,16 @@ export var NORMAL_TEXT = {
24
24
  }),
25
25
  LEGACY_icon: /*#__PURE__*/React.createElement(Text, null)
26
26
  };
27
+ export var SMALL_TEXT = {
28
+ name: 'smallText',
29
+ title: messages.smallText,
30
+ nodeName: 'paragraph',
31
+ markName: 'fontSize',
32
+ icon: /*#__PURE__*/React.createElement(TextIcon, {
33
+ label: ""
34
+ }),
35
+ LEGACY_icon: /*#__PURE__*/React.createElement(Text, null)
36
+ };
27
37
  export var HEADING_1 = {
28
38
  name: 'heading1',
29
39
  title: messages.heading1,
@@ -111,7 +121,7 @@ export var OTHER = {
111
121
  title: messages.other,
112
122
  nodeName: ''
113
123
  };
114
- export var TEXT_BLOCK_TYPES = [NORMAL_TEXT, HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6];
124
+ export var TEXT_BLOCK_TYPES = [NORMAL_TEXT, SMALL_TEXT, HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6];
115
125
  var ToolbarBlockTypes = /*#__PURE__*/function (ToolbarBlockTypes) {
116
126
  ToolbarBlockTypes["normal"] = "normal";
117
127
  ToolbarBlockTypes["heading1"] = "heading1";
@@ -123,8 +133,9 @@ var ToolbarBlockTypes = /*#__PURE__*/function (ToolbarBlockTypes) {
123
133
  ToolbarBlockTypes["blockquote"] = "blockquote";
124
134
  return ToolbarBlockTypes;
125
135
  }(ToolbarBlockTypes || {});
126
- export var toolbarBlockTypesWithRank = function toolbarBlockTypesWithRank() {
127
- return {
136
+ export var toolbarBlockTypesWithRank = function toolbarBlockTypesWithRank(_ref) {
137
+ var allowFontSize = _ref.allowFontSize;
138
+ return _objectSpread(_objectSpread({
128
139
  normal: _objectSpread(_objectSpread({}, NORMAL_TEXT), {}, {
129
140
  icon: /*#__PURE__*/React.createElement(EditorToolbarTextIcon, {
130
141
  size: "small",
@@ -132,7 +143,17 @@ export var toolbarBlockTypesWithRank = function toolbarBlockTypesWithRank() {
132
143
  }),
133
144
  toolbarRank: TEXT_STYLES_MENU_SECTION_RANK[NORMAL_TEXT_MENU_ITEM.key],
134
145
  toolbarKey: NORMAL_TEXT_MENU_ITEM.key
135
- }),
146
+ })
147
+ }, allowFontSize && expValEquals('platform_editor_small_font_size', 'isEnabled', true) && {
148
+ smallText: _objectSpread(_objectSpread({}, SMALL_TEXT), {}, {
149
+ icon: /*#__PURE__*/React.createElement(TextIcon, {
150
+ size: "small",
151
+ label: ""
152
+ }),
153
+ toolbarRank: TEXT_STYLES_MENU_SECTION_RANK[SMALL_TEXT_MENU_ITEM.key],
154
+ toolbarKey: SMALL_TEXT_MENU_ITEM.key
155
+ })
156
+ }), {}, {
136
157
  heading1: _objectSpread(_objectSpread({}, HEADING_1), {}, {
137
158
  icon: /*#__PURE__*/React.createElement(HeadingOneIcon, {
138
159
  size: "small",
@@ -189,16 +210,14 @@ export var toolbarBlockTypesWithRank = function toolbarBlockTypesWithRank() {
189
210
  toolbarRank: TEXT_STYLES_MENU_SECTION_RANK[BLOCK_QUOTE_MENU_ITEM.key],
190
211
  toolbarKey: BLOCK_QUOTE_MENU_ITEM.key
191
212
  })
192
- };
213
+ });
193
214
  };
194
215
  export var FORMATTING_NODE_TYPES = ['heading', 'blockquote'];
195
216
  export var FORMATTING_MARK_TYPES = ['em', 'code', 'strike', 'strong', 'underline', 'textColor', 'subsup', 'backgroundColor'];
196
217
  export var WRAPPER_BLOCK_TYPES = [BLOCK_QUOTE, CODE_BLOCK, PANEL];
197
218
  export var ALL_BLOCK_TYPES = TEXT_BLOCK_TYPES.concat(WRAPPER_BLOCK_TYPES);
198
219
  export var getBlockTypesInDropdown = function getBlockTypesInDropdown(includeBlockQuoteAsTextstyleOption) {
199
- return editorExperiment('platform_editor_blockquote_in_text_formatting_menu', true, {
200
- exposure: true
201
- }) && includeBlockQuoteAsTextstyleOption ? [].concat(TEXT_BLOCK_TYPES, [BLOCK_QUOTE]) : TEXT_BLOCK_TYPES;
220
+ return includeBlockQuoteAsTextstyleOption ? [].concat(TEXT_BLOCK_TYPES, [BLOCK_QUOTE]) : TEXT_BLOCK_TYPES;
202
221
  };
203
222
  export var HEADINGS_BY_LEVEL = TEXT_BLOCK_TYPES.reduce(function (acc, blockType) {
204
223
  if (blockType.level && blockType.nodeName === 'heading') {
@@ -7,7 +7,7 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
7
7
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
8
8
  import { fg } from '@atlaskit/platform-feature-flags';
9
9
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
10
- 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
+ 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, SMALL_TEXT } from './block-types';
11
11
  import { setHeadingWithAnalytics, setNormalTextWithAnalytics } from './commands/block-type';
12
12
  import { HEADING_KEYS, HEADING_NUMPAD_KEYS } from './consts';
13
13
  import { areBlockTypesDisabled, checkFormattingIsPresent, hasBlockQuoteInOptions } from './utils';
@@ -17,6 +17,10 @@ var blockTypeForNode = function blockTypeForNode(node, schema) {
17
17
  if (maybeNode) {
18
18
  return maybeNode;
19
19
  }
20
+ } else if (node.marks.some(function (m) {
21
+ return m.type.name === 'fontSize' && m.attrs.fontSize === 'small';
22
+ }) && expValEquals('platform_editor_small_font_size', 'isEnabled', true)) {
23
+ return SMALL_TEXT;
20
24
  } else if (node.type === schema.nodes.paragraph) {
21
25
  return NORMAL_TEXT;
22
26
  } else if (node.type === schema.nodes.blockquote) {
@@ -35,6 +39,8 @@ var isBlockTypeSchemaSupported = function isBlockTypeSchemaSupported(blockType,
35
39
  case HEADING_5:
36
40
  case HEADING_6:
37
41
  return !!state.schema.nodes.heading;
42
+ case SMALL_TEXT:
43
+ return !!state.schema.marks.fontSize && expValEquals('platform_editor_small_font_size', 'isEnabled', true);
38
44
  case BLOCK_QUOTE:
39
45
  return !!state.schema.nodes.blockquote;
40
46
  case CODE_BLOCK:
@@ -77,6 +77,7 @@ var HeadingText = function HeadingText(_ref) {
77
77
  };
78
78
  var headingSizeStylesMap = {
79
79
  normal: "_11c8fhey",
80
+ smallText: "_11c8fhey",
80
81
  heading1: "_11c812ln",
81
82
  heading2: "_11c810sd",
82
83
  heading3: "_11c81af2",
@@ -86,6 +87,11 @@ var headingSizeStylesMap = {
86
87
  };
87
88
  var shortcuts = {
88
89
  normal: setNormalText,
90
+ smallText: {
91
+ description: '',
92
+ mac: '',
93
+ windows: ''
94
+ },
89
95
  heading1: toggleHeading1,
90
96
  heading2: toggleHeading2,
91
97
  heading3: toggleHeading3,
@@ -17,14 +17,17 @@ var usePluginState = function usePluginState(api) {
17
17
  };
18
18
  export var TextStylesMenuButton = function TextStylesMenuButton(_ref) {
19
19
  var _Object$values$find;
20
- var api = _ref.api,
20
+ var allowFontSize = _ref.allowFontSize,
21
+ api = _ref.api,
21
22
  children = _ref.children;
22
23
  var _useIntl = useIntl(),
23
24
  formatMessage = _useIntl.formatMessage;
24
25
  var _usePluginState = usePluginState(api),
25
26
  blockTypesDisabled = _usePluginState.blockTypesDisabled,
26
27
  currentBlockType = _usePluginState.currentBlockType;
27
- var blockTypes = toolbarBlockTypesWithRank();
28
+ var blockTypes = toolbarBlockTypesWithRank({
29
+ allowFontSize: allowFontSize
30
+ });
28
31
  var _useEditorToolbar = useEditorToolbar(),
29
32
  editorAppearance = _useEditorToolbar.editorAppearance;
30
33
  var CurrentIcon = (_Object$values$find = Object.values(blockTypes).find(function (blockType) {
@@ -54,6 +57,9 @@ export var TextStylesMenuButton = function TextStylesMenuButton(_ref) {
54
57
  iconBefore: TriggerIcon,
55
58
  tooltipComponent: /*#__PURE__*/React.createElement(ToolbarTooltip, {
56
59
  content: formatMessage(toolbarMessages.textStylesTooltip)
60
+ }),
61
+ label: formatMessage(toolbarMessages.textStyles, {
62
+ blockTypeName: currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.name
57
63
  })
58
64
  }, children);
59
65
  }
@@ -61,6 +67,9 @@ export var TextStylesMenuButton = function TextStylesMenuButton(_ref) {
61
67
  content: formatMessage(toolbarMessages.textStylesTooltip)
62
68
  }, /*#__PURE__*/React.createElement(ToolbarDropdownMenu, {
63
69
  isDisabled: blockTypesDisabled,
64
- iconBefore: TriggerIcon
70
+ iconBefore: TriggerIcon,
71
+ label: formatMessage(toolbarMessages.textStyles, {
72
+ blockTypeName: currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.name
73
+ })
65
74
  }, children));
66
75
  };
@@ -4,7 +4,7 @@
4
4
  */
5
5
  import React from 'react';
6
6
 
7
- // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
8
8
  import { jsx } from '@emotion/react';
9
9
  import { FormattedMessage } from 'react-intl-next';
10
10
  import { toolbarMessages } from '@atlaskit/editor-common/messages';
@@ -295,5 +295,6 @@ var ToolbarBlockType = /*#__PURE__*/function (_React$PureComponent) {
295
295
  );
296
296
  }
297
297
  }]);
298
- }(React.PureComponent);
299
- export default injectIntl(ToolbarBlockType);
298
+ }(React.PureComponent); // eslint-disable-next-line @typescript-eslint/ban-types
299
+ var _default_1 = injectIntl(ToolbarBlockType);
300
+ export default _default_1;
@@ -4,7 +4,7 @@ import { toolbarBlockTypesWithRank } from '../block-types';
4
4
  import { HeadingButton } from './ToolbarBlockType/HeadingButton';
5
5
  import { QuoteButton } from './ToolbarBlockType/QuoteButton';
6
6
  import { TextStylesMenuButton } from './ToolbarBlockType/TextStylesMenuButton';
7
- export var getToolbarComponents = function getToolbarComponents(api) {
7
+ export var getToolbarComponents = function getToolbarComponents(api, allowFontSize) {
8
8
  var toolbarComponents = [{
9
9
  type: TEXT_STYLES_GROUP.type,
10
10
  key: TEXT_STYLES_GROUP.key,
@@ -28,7 +28,8 @@ export var getToolbarComponents = function getToolbarComponents(api) {
28
28
  component: function component(_ref) {
29
29
  var children = _ref.children;
30
30
  return /*#__PURE__*/React.createElement(TextStylesMenuButton, {
31
- api: api
31
+ api: api,
32
+ allowFontSize: allowFontSize
32
33
  }, children);
33
34
  }
34
35
  }, {
@@ -44,7 +45,9 @@ export var getToolbarComponents = function getToolbarComponents(api) {
44
45
  rank: TEXT_COLLAPSED_MENU_RANK[TEXT_STYLES_MENU_SECTION.key]
45
46
  }]
46
47
  }];
47
- Object.values(toolbarBlockTypesWithRank()).forEach(function (blockType) {
48
+ Object.values(toolbarBlockTypesWithRank({
49
+ allowFontSize: allowFontSize
50
+ })).forEach(function (blockType) {
48
51
  if (blockType.toolbarKey) {
49
52
  var menuItem = {
50
53
  type: 'menu-item',
@@ -1,5 +1,6 @@
1
1
  import type { BlockType, BlockTypeWithRank } from './types';
2
2
  export declare const NORMAL_TEXT: BlockType;
3
+ export declare const SMALL_TEXT: BlockType;
3
4
  export declare const HEADING_1: BlockType;
4
5
  export declare const HEADING_2: BlockType;
5
6
  export declare const HEADING_3: BlockType;
@@ -21,8 +22,10 @@ declare enum ToolbarBlockTypes {
21
22
  heading6 = "heading6",
22
23
  blockquote = "blockquote"
23
24
  }
24
- export declare const toolbarBlockTypesWithRank: () => Record<ToolbarBlockTypes, BlockTypeWithRank>;
25
- export type TextBlockTypes = 'normal' | 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6';
25
+ export declare const toolbarBlockTypesWithRank: ({ allowFontSize, }: {
26
+ allowFontSize?: boolean;
27
+ }) => Record<ToolbarBlockTypes, BlockTypeWithRank>;
28
+ export type TextBlockTypes = 'normal' | 'smallText' | 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6';
26
29
  export declare const FORMATTING_NODE_TYPES: string[];
27
30
  export declare const FORMATTING_MARK_TYPES: string[];
28
31
  export declare const WRAPPER_BLOCK_TYPES: BlockType[];
@@ -7,6 +7,7 @@ export interface BlockType {
7
7
  icon?: ReactElement;
8
8
  LEGACY_icon?: ReactElement;
9
9
  level?: HeadingLevelsAndNormalText;
10
+ markName?: string;
10
11
  name: string;
11
12
  nodeName: string;
12
13
  tagName?: string;
@@ -2,8 +2,9 @@ import React from 'react';
2
2
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
3
  import type { BlockTypePlugin } from '../../../blockTypePluginType';
4
4
  type TextStylesMenuButtonProps = {
5
+ allowFontSize?: boolean;
5
6
  api?: ExtractInjectionAPI<BlockTypePlugin>;
6
7
  children: React.ReactNode;
7
8
  };
8
- export declare const TextStylesMenuButton: ({ api, children, }: TextStylesMenuButtonProps) => React.JSX.Element;
9
+ export declare const TextStylesMenuButton: ({ allowFontSize, api, children, }: TextStylesMenuButtonProps) => React.JSX.Element;
9
10
  export {};
@@ -3,7 +3,7 @@
3
3
  * @jsx jsx
4
4
  */
5
5
  import React from 'react';
6
- import type { WrappedComponentProps } from 'react-intl-next';
6
+ import type { WithIntlProps, WrappedComponentProps } from 'react-intl-next';
7
7
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
8
8
  import type { MenuItem } from '@atlaskit/editor-common/ui-menu';
9
9
  import type { EditorView } from '@atlaskit/editor-prosemirror/view';
@@ -39,7 +39,7 @@ export interface State {
39
39
  observer: ThemeMutationObserver | null;
40
40
  typographyTheme?: ThemeState['typography'];
41
41
  }
42
- declare const _default: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
42
+ declare const _default_1: React.FC<WithIntlProps<Props & WrappedComponentProps>> & {
43
43
  WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
44
44
  };
45
- export default _default;
45
+ export default _default_1;
@@ -1,4 +1,4 @@
1
1
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
2
2
  import type { RegisterComponent } from '@atlaskit/editor-toolbar-model';
3
3
  import type { BlockTypePlugin } from '../../blockTypePluginType';
4
- export declare const getToolbarComponents: (api?: ExtractInjectionAPI<BlockTypePlugin>) => RegisterComponent[];
4
+ export declare const getToolbarComponents: (api?: ExtractInjectionAPI<BlockTypePlugin>, allowFontSize?: boolean) => RegisterComponent[];
@@ -1,5 +1,6 @@
1
1
  import type { BlockType, BlockTypeWithRank } from './types';
2
2
  export declare const NORMAL_TEXT: BlockType;
3
+ export declare const SMALL_TEXT: BlockType;
3
4
  export declare const HEADING_1: BlockType;
4
5
  export declare const HEADING_2: BlockType;
5
6
  export declare const HEADING_3: BlockType;
@@ -21,8 +22,10 @@ declare enum ToolbarBlockTypes {
21
22
  heading6 = "heading6",
22
23
  blockquote = "blockquote"
23
24
  }
24
- export declare const toolbarBlockTypesWithRank: () => Record<ToolbarBlockTypes, BlockTypeWithRank>;
25
- export type TextBlockTypes = 'normal' | 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6';
25
+ export declare const toolbarBlockTypesWithRank: ({ allowFontSize, }: {
26
+ allowFontSize?: boolean;
27
+ }) => Record<ToolbarBlockTypes, BlockTypeWithRank>;
28
+ export type TextBlockTypes = 'normal' | 'smallText' | 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6';
26
29
  export declare const FORMATTING_NODE_TYPES: string[];
27
30
  export declare const FORMATTING_MARK_TYPES: string[];
28
31
  export declare const WRAPPER_BLOCK_TYPES: BlockType[];
@@ -7,6 +7,7 @@ export interface BlockType {
7
7
  icon?: ReactElement;
8
8
  LEGACY_icon?: ReactElement;
9
9
  level?: HeadingLevelsAndNormalText;
10
+ markName?: string;
10
11
  name: string;
11
12
  nodeName: string;
12
13
  tagName?: string;
@@ -2,8 +2,9 @@ import React from 'react';
2
2
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
3
  import type { BlockTypePlugin } from '../../../blockTypePluginType';
4
4
  type TextStylesMenuButtonProps = {
5
+ allowFontSize?: boolean;
5
6
  api?: ExtractInjectionAPI<BlockTypePlugin>;
6
7
  children: React.ReactNode;
7
8
  };
8
- export declare const TextStylesMenuButton: ({ api, children, }: TextStylesMenuButtonProps) => React.JSX.Element;
9
+ export declare const TextStylesMenuButton: ({ allowFontSize, api, children, }: TextStylesMenuButtonProps) => React.JSX.Element;
9
10
  export {};
@@ -3,7 +3,7 @@
3
3
  * @jsx jsx
4
4
  */
5
5
  import React from 'react';
6
- import type { WrappedComponentProps } from 'react-intl-next';
6
+ import type { WithIntlProps, WrappedComponentProps } from 'react-intl-next';
7
7
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
8
8
  import type { MenuItem } from '@atlaskit/editor-common/ui-menu';
9
9
  import type { EditorView } from '@atlaskit/editor-prosemirror/view';
@@ -39,7 +39,7 @@ export interface State {
39
39
  observer: ThemeMutationObserver | null;
40
40
  typographyTheme?: ThemeState['typography'];
41
41
  }
42
- declare const _default: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
42
+ declare const _default_1: React.FC<WithIntlProps<Props & WrappedComponentProps>> & {
43
43
  WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
44
44
  };
45
- export default _default;
45
+ export default _default_1;
@@ -1,4 +1,4 @@
1
1
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
2
2
  import type { RegisterComponent } from '@atlaskit/editor-toolbar-model';
3
3
  import type { BlockTypePlugin } from '../../blockTypePluginType';
4
- export declare const getToolbarComponents: (api?: ExtractInjectionAPI<BlockTypePlugin>) => RegisterComponent[];
4
+ export declare const getToolbarComponents: (api?: ExtractInjectionAPI<BlockTypePlugin>, allowFontSize?: boolean) => RegisterComponent[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-type",
3
- "version": "12.0.0",
3
+ "version": "12.0.2",
4
4
  "description": "BlockType plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -50,14 +50,14 @@
50
50
  "@atlaskit/prosemirror-history": "^0.2.0",
51
51
  "@atlaskit/prosemirror-input-rules": "^3.6.0",
52
52
  "@atlaskit/theme": "^22.0.0",
53
- "@atlaskit/tmp-editor-statsig": "^35.10.0",
53
+ "@atlaskit/tmp-editor-statsig": "^36.1.0",
54
54
  "@atlaskit/tokens": "^11.1.0",
55
55
  "@babel/runtime": "^7.0.0",
56
56
  "@compiled/react": "^0.20.0",
57
57
  "@emotion/react": "^11.7.1"
58
58
  },
59
59
  "peerDependencies": {
60
- "@atlaskit/editor-common": "^112.0.0",
60
+ "@atlaskit/editor-common": "^112.2.0",
61
61
  "react": "^18.2.0",
62
62
  "react-dom": "^18.2.0",
63
63
  "react-intl-next": "npm:react-intl@^5.18.1"