@atlaskit/editor-plugin-block-type 12.1.1 → 12.1.3
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.
- package/CHANGELOG.md +25 -0
- package/dist/cjs/blockTypePlugin.js +1 -1
- package/dist/cjs/pm-plugins/commands/block-type.js +125 -18
- package/dist/cjs/pm-plugins/main.js +3 -3
- package/dist/cjs/pm-plugins/ui/ToolbarBlockType/HeadingButton.compiled.css +1 -0
- package/dist/cjs/pm-plugins/ui/ToolbarBlockType/HeadingButton.js +23 -0
- package/dist/cjs/pm-plugins/ui/ToolbarBlockType/QuoteButton.js +16 -0
- package/dist/cjs/pm-plugins/utils.js +85 -11
- package/dist/es2019/blockTypePlugin.js +1 -1
- package/dist/es2019/pm-plugins/commands/block-type.js +105 -2
- package/dist/es2019/pm-plugins/main.js +3 -3
- package/dist/es2019/pm-plugins/ui/ToolbarBlockType/HeadingButton.compiled.css +1 -0
- package/dist/es2019/pm-plugins/ui/ToolbarBlockType/HeadingButton.js +24 -0
- package/dist/es2019/pm-plugins/ui/ToolbarBlockType/QuoteButton.js +17 -0
- package/dist/es2019/pm-plugins/utils.js +80 -5
- package/dist/esm/blockTypePlugin.js +1 -1
- package/dist/esm/pm-plugins/commands/block-type.js +123 -18
- package/dist/esm/pm-plugins/main.js +3 -3
- package/dist/esm/pm-plugins/ui/ToolbarBlockType/HeadingButton.compiled.css +1 -0
- package/dist/esm/pm-plugins/ui/ToolbarBlockType/HeadingButton.js +23 -0
- package/dist/esm/pm-plugins/ui/ToolbarBlockType/QuoteButton.js +16 -0
- package/dist/esm/pm-plugins/utils.js +81 -10
- package/dist/types/pm-plugins/commands/block-type.d.ts +2 -0
- package/dist/types/pm-plugins/main.d.ts +1 -1
- package/dist/types/pm-plugins/utils.d.ts +18 -2
- package/dist/types-ts4.5/pm-plugins/commands/block-type.d.ts +2 -0
- package/dist/types-ts4.5/pm-plugins/main.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/utils.d.ts +18 -2
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,30 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-block-type
|
|
2
2
|
|
|
3
|
+
## 12.1.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`4cac24cfac09d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4cac24cfac09d) -
|
|
8
|
+
Add support for text styles menu inside lists (bullet, ordered) when
|
|
9
|
+
platform_editor_small_font_size experiment is enabled. Enables Normal text and Small text options
|
|
10
|
+
while disabling other items (headings, quote). Applies fontSize mark to entire list when toggling
|
|
11
|
+
small/normal text.
|
|
12
|
+
- Updated dependencies
|
|
13
|
+
|
|
14
|
+
## 12.1.2
|
|
15
|
+
|
|
16
|
+
### Patch Changes
|
|
17
|
+
|
|
18
|
+
- [`8b781b3b3f9ca`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8b781b3b3f9ca) -
|
|
19
|
+
Add setSmallText and setSmallTextWithAnalytics commands, modify setNormalText to remove fontSize
|
|
20
|
+
mark, add FORMAT_SMALL_TEXT analytics enum.
|
|
21
|
+
|
|
22
|
+
Add support to the renderer to render 'small text'.
|
|
23
|
+
|
|
24
|
+
Add 'fontSize' to stage0 default schema.
|
|
25
|
+
|
|
26
|
+
- Updated dependencies
|
|
27
|
+
|
|
3
28
|
## 12.1.1
|
|
4
29
|
|
|
5
30
|
### Patch Changes
|
|
@@ -178,7 +178,7 @@ var blockTypePlugin = exports.blockTypePlugin = function blockTypePlugin(_ref3)
|
|
|
178
178
|
name: 'blockType',
|
|
179
179
|
plugin: function plugin(_ref5) {
|
|
180
180
|
var dispatch = _ref5.dispatch;
|
|
181
|
-
return (0, _main.createPlugin)(api, dispatch, options && options.lastNodeMustBeParagraph, options === null || options === void 0 ? void 0 : options.includeBlockQuoteAsTextstyleOption);
|
|
181
|
+
return (0, _main.createPlugin)(api, dispatch, options && options.lastNodeMustBeParagraph, options === null || options === void 0 ? void 0 : options.includeBlockQuoteAsTextstyleOption, options === null || options === void 0 ? void 0 : options.allowFontSize);
|
|
182
182
|
}
|
|
183
183
|
}, {
|
|
184
184
|
name: 'blockTypeInputRule',
|
|
@@ -13,12 +13,17 @@ exports.setHeading = setHeading;
|
|
|
13
13
|
exports.setHeadingWithAnalytics = void 0;
|
|
14
14
|
exports.setNormalText = setNormalText;
|
|
15
15
|
exports.setNormalTextWithAnalytics = setNormalTextWithAnalytics;
|
|
16
|
+
exports.setSmallText = setSmallText;
|
|
17
|
+
exports.setSmallTextWithAnalytics = setSmallTextWithAnalytics;
|
|
16
18
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
19
|
+
var _commands = require("@atlaskit/editor-common/commands");
|
|
17
20
|
var _editorAnalytics = require("@atlaskit/editor-common/editor-analytics");
|
|
18
21
|
var _utils = require("@atlaskit/editor-common/utils");
|
|
19
22
|
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
20
23
|
var _editorTables = require("@atlaskit/editor-tables");
|
|
24
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
21
25
|
var _blockTypes = require("../block-types");
|
|
26
|
+
var _utils2 = require("../utils");
|
|
22
27
|
var _clearFormatting = require("./clear-formatting");
|
|
23
28
|
var _wrapSelectionIn = require("./wrapSelectionIn");
|
|
24
29
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
|
|
@@ -33,6 +38,11 @@ function setBlockType(name) {
|
|
|
33
38
|
tr: tr
|
|
34
39
|
});
|
|
35
40
|
}
|
|
41
|
+
if (name === 'smallText' && (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true)) {
|
|
42
|
+
return setSmallText()({
|
|
43
|
+
tr: tr
|
|
44
|
+
});
|
|
45
|
+
}
|
|
36
46
|
var headingBlockType = _blockTypes.HEADINGS_BY_NAME[name];
|
|
37
47
|
if (headingBlockType && nodes.heading && headingBlockType.level) {
|
|
38
48
|
return setHeading(headingBlockType.level)({
|
|
@@ -76,18 +86,45 @@ function setHeading(level, fromBlockQuote) {
|
|
|
76
86
|
});
|
|
77
87
|
}
|
|
78
88
|
});
|
|
89
|
+
|
|
90
|
+
// Remove fontSize mark from transformed content in range
|
|
91
|
+
// List content stays as paragraphs (headings aren't allowed in list items),
|
|
92
|
+
// but non-list content has been converted to headings by setBlockType above.
|
|
93
|
+
var fontSize = schema.marks.fontSize;
|
|
94
|
+
if (fontSize && (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true)) {
|
|
95
|
+
var allowedBlocks = [schema.nodes.paragraph, schema.nodes.heading];
|
|
96
|
+
if (selection instanceof _editorTables.CellSelection) {
|
|
97
|
+
selection.forEachCell(function (cell, pos) {
|
|
98
|
+
(0, _commands.createToggleBlockMarkOnRangeNext)(fontSize, function () {
|
|
99
|
+
return false;
|
|
100
|
+
}, allowedBlocks)(pos, pos + cell.nodeSize, tr);
|
|
101
|
+
});
|
|
102
|
+
} else {
|
|
103
|
+
var expandedRange = (0, _utils2.getSelectionRangeExpandedToLists)(tr);
|
|
104
|
+
(0, _commands.createToggleBlockMarkOnRangeNext)(fontSize, function () {
|
|
105
|
+
return false;
|
|
106
|
+
}, allowedBlocks)(expandedRange.from, expandedRange.to, tr);
|
|
107
|
+
}
|
|
108
|
+
}
|
|
79
109
|
return tr;
|
|
80
110
|
};
|
|
81
111
|
}
|
|
82
112
|
function setBlockTypeWithAnalytics(name, inputMethod, editorAnalyticsApi, fromBlockQuote) {
|
|
83
113
|
return function (_ref4) {
|
|
84
114
|
var tr = _ref4.tr;
|
|
85
|
-
var
|
|
115
|
+
var _tr$doc$type$schema = tr.doc.type.schema,
|
|
116
|
+
nodes = _tr$doc$type$schema.nodes,
|
|
117
|
+
marks = _tr$doc$type$schema.marks;
|
|
86
118
|
if (name === 'normal' && nodes.paragraph) {
|
|
87
119
|
return setNormalTextWithAnalytics(inputMethod, editorAnalyticsApi, fromBlockQuote)({
|
|
88
120
|
tr: tr
|
|
89
121
|
});
|
|
90
122
|
}
|
|
123
|
+
if (name === 'smallText' && marks.fontSize && (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true)) {
|
|
124
|
+
return setSmallTextWithAnalytics(inputMethod, editorAnalyticsApi)({
|
|
125
|
+
tr: tr
|
|
126
|
+
});
|
|
127
|
+
}
|
|
91
128
|
var headingBlockType = _blockTypes.HEADINGS_BY_NAME[name];
|
|
92
129
|
if (headingBlockType && nodes.heading && headingBlockType.level) {
|
|
93
130
|
return setHeadingWithAnalytics(headingBlockType.level, inputMethod, editorAnalyticsApi, fromBlockQuote)({
|
|
@@ -97,15 +134,68 @@ function setBlockTypeWithAnalytics(name, inputMethod, editorAnalyticsApi, fromBl
|
|
|
97
134
|
return null;
|
|
98
135
|
};
|
|
99
136
|
}
|
|
100
|
-
function
|
|
137
|
+
function setSmallText() {
|
|
101
138
|
return function (_ref5) {
|
|
102
139
|
var tr = _ref5.tr;
|
|
140
|
+
var _tr$doc$type$schema2 = tr.doc.type.schema,
|
|
141
|
+
fontSize = _tr$doc$type$schema2.marks.fontSize,
|
|
142
|
+
paragraph = _tr$doc$type$schema2.nodes.paragraph;
|
|
143
|
+
if (!fontSize) {
|
|
144
|
+
return null;
|
|
145
|
+
}
|
|
146
|
+
var selection = tr.selection;
|
|
147
|
+
if (selection instanceof _editorTables.CellSelection) {
|
|
148
|
+
selection.forEachCell(function (cell, pos) {
|
|
149
|
+
tr.setBlockType(pos, pos + cell.nodeSize, paragraph);
|
|
150
|
+
(0, _commands.createToggleBlockMarkOnRangeNext)(fontSize, function () {
|
|
151
|
+
return {
|
|
152
|
+
fontSize: 'small'
|
|
153
|
+
};
|
|
154
|
+
}, [paragraph])(pos, pos + cell.nodeSize, tr);
|
|
155
|
+
});
|
|
156
|
+
} else {
|
|
157
|
+
tr.setBlockType(selection.from, selection.to, paragraph);
|
|
158
|
+
var expandedRange = (0, _utils2.getSelectionRangeExpandedToLists)(tr);
|
|
159
|
+
(0, _commands.createToggleBlockMarkOnRangeNext)(fontSize, function () {
|
|
160
|
+
return {
|
|
161
|
+
fontSize: 'small'
|
|
162
|
+
};
|
|
163
|
+
}, [paragraph])(expandedRange.from, expandedRange.to, tr);
|
|
164
|
+
}
|
|
165
|
+
return tr;
|
|
166
|
+
};
|
|
167
|
+
}
|
|
168
|
+
function setSmallTextWithAnalytics(inputMethod, editorAnalyticsApi) {
|
|
169
|
+
return withCurrentHeadingLevel(function (previousHeadingLevel) {
|
|
170
|
+
return function (_ref6) {
|
|
171
|
+
var tr = _ref6.tr;
|
|
172
|
+
editorAnalyticsApi === null || editorAnalyticsApi === void 0 || editorAnalyticsApi.attachAnalyticsEvent({
|
|
173
|
+
action: _analytics.ACTION.FORMATTED,
|
|
174
|
+
actionSubject: _analytics.ACTION_SUBJECT.TEXT,
|
|
175
|
+
eventType: _analytics.EVENT_TYPE.TRACK,
|
|
176
|
+
actionSubjectId: _analytics.ACTION_SUBJECT_ID.FORMAT_SMALL_TEXT,
|
|
177
|
+
attributes: {
|
|
178
|
+
inputMethod: inputMethod,
|
|
179
|
+
previousBlockType: previousHeadingLevel !== undefined ? String(previousHeadingLevel) : undefined
|
|
180
|
+
}
|
|
181
|
+
})(tr);
|
|
182
|
+
return setSmallText()({
|
|
183
|
+
tr: tr
|
|
184
|
+
});
|
|
185
|
+
};
|
|
186
|
+
});
|
|
187
|
+
}
|
|
188
|
+
function setNormalText(fromBlockQuote) {
|
|
189
|
+
return function (_ref7) {
|
|
190
|
+
var tr = _ref7.tr;
|
|
103
191
|
var selection = tr.selection,
|
|
104
192
|
schema = tr.doc.type.schema;
|
|
193
|
+
|
|
194
|
+
// Apply normal text to the selection range (handles non-list content)
|
|
105
195
|
var ranges = selection instanceof _editorTables.CellSelection ? selection.ranges : [selection];
|
|
106
|
-
ranges.forEach(function (
|
|
107
|
-
var $from =
|
|
108
|
-
$to =
|
|
196
|
+
ranges.forEach(function (_ref8) {
|
|
197
|
+
var $from = _ref8.$from,
|
|
198
|
+
$to = _ref8.$to;
|
|
109
199
|
if (fromBlockQuote) {
|
|
110
200
|
var range = $from.blockRange($to);
|
|
111
201
|
if (!range) {
|
|
@@ -124,12 +214,29 @@ function setNormalText(fromBlockQuote) {
|
|
|
124
214
|
tr.setBlockType($from.pos, $to.pos, schema.nodes.paragraph);
|
|
125
215
|
}
|
|
126
216
|
});
|
|
217
|
+
|
|
218
|
+
// Remove fontSize mark from any lists the selection touches
|
|
219
|
+
var fontSize = schema.marks.fontSize;
|
|
220
|
+
if (fontSize && (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true)) {
|
|
221
|
+
if (selection instanceof _editorTables.CellSelection) {
|
|
222
|
+
selection.forEachCell(function (cell, pos) {
|
|
223
|
+
(0, _commands.createToggleBlockMarkOnRangeNext)(fontSize, function () {
|
|
224
|
+
return false;
|
|
225
|
+
}, [schema.nodes.paragraph])(pos, pos + cell.nodeSize, tr);
|
|
226
|
+
});
|
|
227
|
+
} else {
|
|
228
|
+
var expandedRange = (0, _utils2.getSelectionRangeExpandedToLists)(tr);
|
|
229
|
+
(0, _commands.createToggleBlockMarkOnRangeNext)(fontSize, function () {
|
|
230
|
+
return false;
|
|
231
|
+
}, [schema.nodes.paragraph])(expandedRange.from, expandedRange.to, tr);
|
|
232
|
+
}
|
|
233
|
+
}
|
|
127
234
|
return tr;
|
|
128
235
|
};
|
|
129
236
|
}
|
|
130
237
|
function clearFormatting(inputMethod, editorAnalyticsApi) {
|
|
131
|
-
return function (
|
|
132
|
-
var tr =
|
|
238
|
+
return function (_ref9) {
|
|
239
|
+
var tr = _ref9.tr;
|
|
133
240
|
var formattingCleared = [];
|
|
134
241
|
var schema = tr.doc.type.schema;
|
|
135
242
|
_clearFormatting.FORMATTING_MARK_TYPES.forEach(function (mark) {
|
|
@@ -186,8 +293,8 @@ function clearFormatting(inputMethod, editorAnalyticsApi) {
|
|
|
186
293
|
};
|
|
187
294
|
}
|
|
188
295
|
function withCurrentHeadingLevel(fn) {
|
|
189
|
-
return function (
|
|
190
|
-
var tr =
|
|
296
|
+
return function (_ref0) {
|
|
297
|
+
var tr = _ref0.tr;
|
|
191
298
|
// Find all headings and paragraphs of text
|
|
192
299
|
var _tr$doc$type$schema$n = tr.doc.type.schema.nodes,
|
|
193
300
|
heading = _tr$doc$type$schema$n.heading,
|
|
@@ -224,8 +331,8 @@ function withCurrentHeadingLevel(fn) {
|
|
|
224
331
|
}
|
|
225
332
|
function setNormalTextWithAnalytics(inputMethod, editorAnalyticsApi, fromBlockQuote) {
|
|
226
333
|
return withCurrentHeadingLevel(function (previousHeadingLevel) {
|
|
227
|
-
return function (
|
|
228
|
-
var tr =
|
|
334
|
+
return function (_ref1) {
|
|
335
|
+
var tr = _ref1.tr;
|
|
229
336
|
editorAnalyticsApi === null || editorAnalyticsApi === void 0 || editorAnalyticsApi.attachAnalyticsEvent({
|
|
230
337
|
action: _analytics.ACTION.FORMATTED,
|
|
231
338
|
actionSubject: _analytics.ACTION_SUBJECT.TEXT,
|
|
@@ -245,8 +352,8 @@ function setNormalTextWithAnalytics(inputMethod, editorAnalyticsApi, fromBlockQu
|
|
|
245
352
|
}
|
|
246
353
|
var setHeadingWithAnalytics = exports.setHeadingWithAnalytics = function setHeadingWithAnalytics(newHeadingLevel, inputMethod, editorAnalyticsApi, fromBlockQuote) {
|
|
247
354
|
return withCurrentHeadingLevel(function (previousHeadingLevel) {
|
|
248
|
-
return function (
|
|
249
|
-
var tr =
|
|
355
|
+
return function (_ref10) {
|
|
356
|
+
var tr = _ref10.tr;
|
|
250
357
|
editorAnalyticsApi === null || editorAnalyticsApi === void 0 || editorAnalyticsApi.attachAnalyticsEvent({
|
|
251
358
|
action: _analytics.ACTION.FORMATTED,
|
|
252
359
|
actionSubject: _analytics.ACTION_SUBJECT.TEXT,
|
|
@@ -294,9 +401,9 @@ var insertBlockQuoteWithAnalytics = exports.insertBlockQuoteWithAnalytics = func
|
|
|
294
401
|
})(insertBlockQuote());
|
|
295
402
|
};
|
|
296
403
|
function insertBlockQuoteWithAnalyticsCommand(inputMethod, editorAnalyticsApi) {
|
|
297
|
-
return withCurrentHeadingLevel(function (
|
|
298
|
-
return function (
|
|
299
|
-
var tr =
|
|
404
|
+
return withCurrentHeadingLevel(function () {
|
|
405
|
+
return function (_ref11) {
|
|
406
|
+
var tr = _ref11.tr;
|
|
300
407
|
var nodes = tr.doc.type.schema.nodes;
|
|
301
408
|
editorAnalyticsApi === null || editorAnalyticsApi === void 0 || editorAnalyticsApi.attachAnalyticsEvent({
|
|
302
409
|
action: _analytics.ACTION.FORMATTED,
|
|
@@ -314,8 +421,8 @@ function insertBlockQuoteWithAnalyticsCommand(inputMethod, editorAnalyticsApi) {
|
|
|
314
421
|
});
|
|
315
422
|
}
|
|
316
423
|
var cleanUpAtTheStartOfDocument = exports.cleanUpAtTheStartOfDocument = function cleanUpAtTheStartOfDocument(state, dispatch) {
|
|
317
|
-
var
|
|
318
|
-
$cursor =
|
|
424
|
+
var _ref12 = state.selection,
|
|
425
|
+
$cursor = _ref12.$cursor;
|
|
319
426
|
if ($cursor && !$cursor.nodeBefore && !$cursor.nodeAfter && $cursor.pos === 1) {
|
|
320
427
|
var tr = state.tr,
|
|
321
428
|
schema = state.schema;
|
|
@@ -88,7 +88,7 @@ var autoformatHeading = function autoformatHeading(headingLevel, editorAnalytics
|
|
|
88
88
|
return (0, _blockType.setHeadingWithAnalytics)(headingLevel, _analytics.INPUT_METHOD.FORMATTING, editorAnalyticsApi);
|
|
89
89
|
};
|
|
90
90
|
var pluginKey = exports.pluginKey = new _state.PluginKey('blockTypePlugin');
|
|
91
|
-
var createPlugin = exports.createPlugin = function createPlugin(editorAPI, dispatch, lastNodeMustBeParagraph, includeBlockQuoteAsTextstyleOption) {
|
|
91
|
+
var createPlugin = exports.createPlugin = function createPlugin(editorAPI, dispatch, lastNodeMustBeParagraph, includeBlockQuoteAsTextstyleOption, allowFontSize) {
|
|
92
92
|
var _editorAPI$analytics;
|
|
93
93
|
var editorAnalyticsApi = editorAPI === null || editorAPI === void 0 || (_editorAPI$analytics = editorAPI.analytics) === null || _editorAPI$analytics === void 0 ? void 0 : _editorAPI$analytics.actions;
|
|
94
94
|
var altKeyLocation = 0;
|
|
@@ -122,7 +122,7 @@ var createPlugin = exports.createPlugin = function createPlugin(editorAPI, dispa
|
|
|
122
122
|
var formattingIsPresent = (0, _utils.hasBlockQuoteInOptions)(availableBlockTypesInDropdown) ? (0, _utils.checkFormattingIsPresent)(state) : undefined;
|
|
123
123
|
return {
|
|
124
124
|
currentBlockType: detectBlockType(availableBlockTypesInDropdown, state),
|
|
125
|
-
blockTypesDisabled: (0, _utils.areBlockTypesDisabled)(state),
|
|
125
|
+
blockTypesDisabled: (0, _utils.areBlockTypesDisabled)(state, allowFontSize),
|
|
126
126
|
availableBlockTypes: availableBlockTypes,
|
|
127
127
|
availableWrapperBlockTypes: availableWrapperBlockTypes,
|
|
128
128
|
availableBlockTypesInDropdown: availableBlockTypesInDropdown,
|
|
@@ -132,7 +132,7 @@ var createPlugin = exports.createPlugin = function createPlugin(editorAPI, dispa
|
|
|
132
132
|
apply: function apply(_tr, oldPluginState, _oldState, newState) {
|
|
133
133
|
var newPluginState = _objectSpread(_objectSpread({}, oldPluginState), {}, {
|
|
134
134
|
currentBlockType: detectBlockType(oldPluginState.availableBlockTypesInDropdown, newState),
|
|
135
|
-
blockTypesDisabled: (0, _utils.areBlockTypesDisabled)(newState),
|
|
135
|
+
blockTypesDisabled: (0, _utils.areBlockTypesDisabled)(newState, allowFontSize),
|
|
136
136
|
formattingIsPresent: (0, _utils.hasBlockQuoteInOptions)(oldPluginState.availableBlockTypesInDropdown) ? (0, _utils.checkFormattingIsPresent)(newState) : undefined
|
|
137
137
|
});
|
|
138
138
|
if (newPluginState.currentBlockType !== oldPluginState.currentBlockType || newPluginState.blockTypesDisabled !== oldPluginState.blockTypesDisabled || newPluginState.formattingIsPresent !== oldPluginState.formattingIsPresent) {
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
._11c810sd{font:var(--ds-font-heading-large,normal 653 24px/28px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
2
2
|
._11c812ln{font:var(--ds-font-heading-xlarge,normal 653 28px/2pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
3
3
|
._11c812rg{font:var(--_1h4o6ch)}
|
|
4
|
+
._11c8130a{font:var(--_1b6nbh6)}
|
|
4
5
|
._11c81af2{font:var(--ds-font-heading-medium,normal 653 20px/24px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
5
6
|
._11c81e3o{font:var(--ds-font-heading-small,normal 653 1pc/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
6
7
|
._11c81fq3{font:var(--_1d0ko3v)}
|
|
@@ -14,12 +14,15 @@ var _runtime = require("@compiled/react/runtime");
|
|
|
14
14
|
var _reactIntlNext = require("react-intl-next");
|
|
15
15
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
16
16
|
var _keymaps = require("@atlaskit/editor-common/keymaps");
|
|
17
|
+
var _toolbar = require("@atlaskit/editor-common/toolbar");
|
|
17
18
|
var _ugcTokens = require("@atlaskit/editor-common/ugc-tokens");
|
|
18
19
|
var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
|
|
19
20
|
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
20
21
|
var _compiled = require("@atlaskit/primitives/compiled");
|
|
21
22
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
23
|
+
var _utils = require("../../utils");
|
|
22
24
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
25
|
+
var smallTextStyle = null;
|
|
23
26
|
var normalStyle = null;
|
|
24
27
|
var heading1Style = null;
|
|
25
28
|
var heading2Style = null;
|
|
@@ -73,6 +76,13 @@ var HeadingText = function HeadingText(_ref) {
|
|
|
73
76
|
"--_1c98jvx": (0, _runtime.ix)((0, _ugcTokens.editorUGCToken)('editor.font.heading.h6'))
|
|
74
77
|
}
|
|
75
78
|
}, children);
|
|
79
|
+
case 'smallText':
|
|
80
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
81
|
+
className: (0, _runtime.ax)(["_11c8130a"]),
|
|
82
|
+
style: {
|
|
83
|
+
"--_1b6nbh6": (0, _runtime.ix)((0, _ugcTokens.editorUGCToken)('editor.font.body.small'))
|
|
84
|
+
}
|
|
85
|
+
}, children);
|
|
76
86
|
case 'normal':
|
|
77
87
|
default:
|
|
78
88
|
return /*#__PURE__*/React.createElement("div", {
|
|
@@ -107,6 +117,12 @@ var shortcuts = {
|
|
|
107
117
|
heading5: _keymaps.toggleHeading5,
|
|
108
118
|
heading6: _keymaps.toggleHeading6
|
|
109
119
|
};
|
|
120
|
+
var shouldDisableHeadingButton = function shouldDisableHeadingButton(state, blockType) {
|
|
121
|
+
if (!state) {
|
|
122
|
+
return false;
|
|
123
|
+
}
|
|
124
|
+
return (0, _utils.isSelectionInsideListNode)(state) && blockType.name !== 'normal' && blockType.name !== 'smallText';
|
|
125
|
+
};
|
|
110
126
|
var HeadingButton = exports.HeadingButton = function HeadingButton(_ref2) {
|
|
111
127
|
var blockType = _ref2.blockType,
|
|
112
128
|
api = _ref2.api;
|
|
@@ -114,14 +130,20 @@ var HeadingButton = exports.HeadingButton = function HeadingButton(_ref2) {
|
|
|
114
130
|
formatMessage = _useIntl.formatMessage;
|
|
115
131
|
var currentBlockType = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockType.currentBlockType');
|
|
116
132
|
var availableBlockTypesInDropdown = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockType.availableBlockTypesInDropdown');
|
|
133
|
+
var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
|
|
134
|
+
editorView = _useEditorToolbar.editorView;
|
|
117
135
|
if (!(availableBlockTypesInDropdown !== null && availableBlockTypesInDropdown !== void 0 && availableBlockTypesInDropdown.some(function (availableBlockType) {
|
|
118
136
|
return availableBlockType.name === blockType.name;
|
|
119
137
|
}))) {
|
|
120
138
|
return null;
|
|
121
139
|
}
|
|
140
|
+
var isDisabled = (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true) ? shouldDisableHeadingButton(editorView === null || editorView === void 0 ? void 0 : editorView.state, blockType) : false;
|
|
122
141
|
var fromBlockQuote = (currentBlockType === null || currentBlockType === void 0 ? void 0 : currentBlockType.name) === 'blockquote';
|
|
123
142
|
var onClick = function onClick() {
|
|
124
143
|
var _api$core, _api$blockType;
|
|
144
|
+
if (isDisabled) {
|
|
145
|
+
return;
|
|
146
|
+
}
|
|
125
147
|
api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$blockType = api.blockType) === null || _api$blockType === void 0 || (_api$blockType = _api$blockType.commands) === null || _api$blockType === void 0 ? void 0 : _api$blockType.setTextLevel(blockType.name, _analytics.INPUT_METHOD.TOOLBAR, fromBlockQuote));
|
|
126
148
|
};
|
|
127
149
|
var shortcut = (0, _keymaps.formatShortcut)(shortcuts[blockType.name]);
|
|
@@ -133,6 +155,7 @@ var HeadingButton = exports.HeadingButton = function HeadingButton(_ref2) {
|
|
|
133
155
|
}) : undefined,
|
|
134
156
|
onClick: onClick,
|
|
135
157
|
isSelected: isSelected,
|
|
158
|
+
isDisabled: isDisabled,
|
|
136
159
|
ariaKeyshortcuts: shortcut
|
|
137
160
|
}, (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_use_editor_typography', 'isEnabled', true) ? /*#__PURE__*/React.createElement(HeadingText, {
|
|
138
161
|
headingType: blockType.name
|
|
@@ -9,8 +9,17 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
var _reactIntlNext = require("react-intl-next");
|
|
10
10
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
11
11
|
var _keymaps = require("@atlaskit/editor-common/keymaps");
|
|
12
|
+
var _toolbar = require("@atlaskit/editor-common/toolbar");
|
|
12
13
|
var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
|
|
13
14
|
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
15
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
16
|
+
var _utils = require("../../utils");
|
|
17
|
+
var shouldDisableQuoteButton = function shouldDisableQuoteButton(state) {
|
|
18
|
+
if (!state) {
|
|
19
|
+
return false;
|
|
20
|
+
}
|
|
21
|
+
return (0, _utils.isSelectionInsideListNode)(state);
|
|
22
|
+
};
|
|
14
23
|
var QuoteButton = exports.QuoteButton = function QuoteButton(_ref) {
|
|
15
24
|
var blockType = _ref.blockType,
|
|
16
25
|
api = _ref.api;
|
|
@@ -18,13 +27,19 @@ var QuoteButton = exports.QuoteButton = function QuoteButton(_ref) {
|
|
|
18
27
|
formatMessage = _useIntl.formatMessage;
|
|
19
28
|
var availableBlockTypesInDropdown = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockType.availableBlockTypesInDropdown');
|
|
20
29
|
var currentBlockType = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockType.currentBlockType');
|
|
30
|
+
var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
|
|
31
|
+
editorView = _useEditorToolbar.editorView;
|
|
21
32
|
if (!(availableBlockTypesInDropdown !== null && availableBlockTypesInDropdown !== void 0 && availableBlockTypesInDropdown.some(function (availableBlockType) {
|
|
22
33
|
return availableBlockType.name === blockType.name;
|
|
23
34
|
}))) {
|
|
24
35
|
return null;
|
|
25
36
|
}
|
|
37
|
+
var isDisabled = (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true) ? shouldDisableQuoteButton(editorView === null || editorView === void 0 ? void 0 : editorView.state) : false;
|
|
26
38
|
var onClick = function onClick() {
|
|
27
39
|
var _api$core, _api$blockType;
|
|
40
|
+
if (isDisabled) {
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
28
43
|
api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$blockType = api.blockType) === null || _api$blockType === void 0 || (_api$blockType = _api$blockType.commands) === null || _api$blockType === void 0 ? void 0 : _api$blockType.insertBlockQuote(_analytics.INPUT_METHOD.TOOLBAR));
|
|
29
44
|
};
|
|
30
45
|
var shortcut = (0, _keymaps.formatShortcut)(_keymaps.toggleBlockQuote);
|
|
@@ -35,6 +50,7 @@ var QuoteButton = exports.QuoteButton = function QuoteButton(_ref) {
|
|
|
35
50
|
}) : undefined,
|
|
36
51
|
onClick: onClick,
|
|
37
52
|
isSelected: currentBlockType === blockType,
|
|
53
|
+
isDisabled: isDisabled,
|
|
38
54
|
ariaKeyshortcuts: shortcut
|
|
39
55
|
}, formatMessage(blockType.title));
|
|
40
56
|
};
|
|
@@ -4,9 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.areBlockTypesDisabled = areBlockTypesDisabled;
|
|
7
|
-
exports.
|
|
7
|
+
exports.createWrappingTextBlockRule = exports.createJoinNodesRule = exports.checkFormattingIsPresent = void 0;
|
|
8
|
+
exports.getSelectionRangeExpandedToLists = getSelectionRangeExpandedToLists;
|
|
9
|
+
exports.isNodeAWrappingBlockNode = exports.hasBlockQuoteInOptions = void 0;
|
|
10
|
+
exports.isSelectionInsideListNode = isSelectionInsideListNode;
|
|
8
11
|
var _mark = require("@atlaskit/editor-common/mark");
|
|
9
12
|
var _utils = require("@atlaskit/editor-common/utils");
|
|
13
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
10
14
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
11
15
|
var _blockTypes = require("./block-types");
|
|
12
16
|
var isNodeAWrappingBlockNode = exports.isNodeAWrappingBlockNode = function isNodeAWrappingBlockNode(node) {
|
|
@@ -80,12 +84,19 @@ function getSelectedWrapperNodes(state) {
|
|
|
80
84
|
* Function will check if changing block types: Paragraph, Heading is enabled.
|
|
81
85
|
*/
|
|
82
86
|
function areBlockTypesDisabled(state) {
|
|
87
|
+
var allowFontSize = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
83
88
|
var nodesTypes = getSelectedWrapperNodes(state);
|
|
84
89
|
var _state$schema$nodes2 = state.schema.nodes,
|
|
85
90
|
panel = _state$schema$nodes2.panel,
|
|
86
91
|
blockquote = _state$schema$nodes2.blockquote,
|
|
87
92
|
bulletList = _state$schema$nodes2.bulletList,
|
|
88
|
-
orderedList = _state$schema$nodes2.orderedList
|
|
93
|
+
orderedList = _state$schema$nodes2.orderedList,
|
|
94
|
+
listItem = _state$schema$nodes2.listItem;
|
|
95
|
+
|
|
96
|
+
// When the small font size experiment is enabled, allow block type changes inside lists
|
|
97
|
+
// so that users can toggle between Normal text and Small text within list contexts.
|
|
98
|
+
// Note: taskList/taskItem are not excluded here until blockTaskItem conversion is implemented (WI 4).
|
|
99
|
+
var excludedTypes = allowFontSize && (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true) ? [panel, bulletList, orderedList, listItem] : [panel];
|
|
89
100
|
if ((0, _experiments.editorExperiment)('platform_editor_blockquote_in_text_formatting_menu', true)) {
|
|
90
101
|
var hasQuote = false;
|
|
91
102
|
var hasNestedListInQuote = false;
|
|
@@ -106,17 +117,44 @@ function areBlockTypesDisabled(state) {
|
|
|
106
117
|
return !hasNestedListInQuote;
|
|
107
118
|
});
|
|
108
119
|
return nodesTypes.filter(function (type) {
|
|
109
|
-
return type
|
|
120
|
+
return !excludedTypes.includes(type);
|
|
110
121
|
}).length > 0 && (!hasQuote || hasNestedListInQuote);
|
|
111
122
|
}
|
|
112
123
|
return nodesTypes.filter(function (type) {
|
|
113
|
-
return type
|
|
124
|
+
return !excludedTypes.includes(type);
|
|
114
125
|
}).length > 0;
|
|
115
126
|
}
|
|
116
|
-
|
|
127
|
+
|
|
128
|
+
/**
|
|
129
|
+
* Checks if the current selection is inside a list node (bulletList, orderedList, or taskList).
|
|
130
|
+
* Used to determine which text styles should be enabled when the small font size experiment is active.
|
|
131
|
+
*/
|
|
132
|
+
function isSelectionInsideListNode(state) {
|
|
133
|
+
if (!state.selection) {
|
|
134
|
+
return false;
|
|
135
|
+
}
|
|
117
136
|
var _state$selection3 = state.selection,
|
|
118
|
-
from = _state$selection3
|
|
119
|
-
to = _state$selection3
|
|
137
|
+
$from = _state$selection3.$from,
|
|
138
|
+
$to = _state$selection3.$to;
|
|
139
|
+
var _state$schema$nodes3 = state.schema.nodes,
|
|
140
|
+
bulletList = _state$schema$nodes3.bulletList,
|
|
141
|
+
orderedList = _state$schema$nodes3.orderedList,
|
|
142
|
+
taskList = _state$schema$nodes3.taskList;
|
|
143
|
+
var listNodeTypes = [bulletList, orderedList, taskList];
|
|
144
|
+
var insideList = false;
|
|
145
|
+
state.doc.nodesBetween($from.pos, $to.pos, function (node) {
|
|
146
|
+
if (node.isBlock && listNodeTypes.indexOf(node.type) >= 0) {
|
|
147
|
+
insideList = true;
|
|
148
|
+
return false;
|
|
149
|
+
}
|
|
150
|
+
return true;
|
|
151
|
+
});
|
|
152
|
+
return insideList;
|
|
153
|
+
}
|
|
154
|
+
var blockStylingIsPresent = function blockStylingIsPresent(state) {
|
|
155
|
+
var _state$selection4 = state.selection,
|
|
156
|
+
from = _state$selection4.from,
|
|
157
|
+
to = _state$selection4.to;
|
|
120
158
|
var isBlockStyling = false;
|
|
121
159
|
state.doc.nodesBetween(from, to, function (node) {
|
|
122
160
|
if (_blockTypes.FORMATTING_NODE_TYPES.indexOf(node.type.name) !== -1) {
|
|
@@ -130,9 +168,9 @@ var blockStylingIsPresent = function blockStylingIsPresent(state) {
|
|
|
130
168
|
var marksArePresent = function marksArePresent(state) {
|
|
131
169
|
var activeMarkTypes = _blockTypes.FORMATTING_MARK_TYPES.filter(function (mark) {
|
|
132
170
|
if (!!state.schema.marks[mark]) {
|
|
133
|
-
var _state$
|
|
134
|
-
$from = _state$
|
|
135
|
-
empty = _state$
|
|
171
|
+
var _state$selection5 = state.selection,
|
|
172
|
+
$from = _state$selection5.$from,
|
|
173
|
+
empty = _state$selection5.empty;
|
|
136
174
|
var marks = state.schema.marks;
|
|
137
175
|
if (empty) {
|
|
138
176
|
return !!marks[mark].isInSet(state.storedMarks || $from.marks());
|
|
@@ -150,4 +188,40 @@ var hasBlockQuoteInOptions = exports.hasBlockQuoteInOptions = function hasBlockQ
|
|
|
150
188
|
return !!dropdownOptions.find(function (blockType) {
|
|
151
189
|
return blockType.name === 'blockquote';
|
|
152
190
|
});
|
|
153
|
-
};
|
|
191
|
+
};
|
|
192
|
+
|
|
193
|
+
/**
|
|
194
|
+
* Returns a { from, to } range that extends the selection boundaries outward
|
|
195
|
+
* to include the entirety of any list nodes at either end. If the selection
|
|
196
|
+
* start is inside a list, `from` is pulled back to the list's start; if the
|
|
197
|
+
* selection end is inside a list, `to` is pushed forward to the list's end.
|
|
198
|
+
* Non-list content in the middle is included as-is.
|
|
199
|
+
*/
|
|
200
|
+
function getSelectionRangeExpandedToLists(tr) {
|
|
201
|
+
var selection = tr.selection;
|
|
202
|
+
var _tr$doc$type$schema$n = tr.doc.type.schema.nodes,
|
|
203
|
+
bulletList = _tr$doc$type$schema$n.bulletList,
|
|
204
|
+
orderedList = _tr$doc$type$schema$n.orderedList,
|
|
205
|
+
taskList = _tr$doc$type$schema$n.taskList;
|
|
206
|
+
var listNodeTypes = [bulletList, orderedList, taskList];
|
|
207
|
+
var from = selection.from;
|
|
208
|
+
var to = selection.to;
|
|
209
|
+
for (var depth = selection.$from.depth; depth > 0; depth--) {
|
|
210
|
+
var node = selection.$from.node(depth);
|
|
211
|
+
if (listNodeTypes.indexOf(node.type) >= 0) {
|
|
212
|
+
from = selection.$from.before(depth);
|
|
213
|
+
break;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
for (var _depth = selection.$to.depth; _depth > 0; _depth--) {
|
|
217
|
+
var _node = selection.$to.node(_depth);
|
|
218
|
+
if (listNodeTypes.indexOf(_node.type) >= 0) {
|
|
219
|
+
to = selection.$to.after(_depth);
|
|
220
|
+
break;
|
|
221
|
+
}
|
|
222
|
+
}
|
|
223
|
+
return {
|
|
224
|
+
from: from,
|
|
225
|
+
to: to
|
|
226
|
+
};
|
|
227
|
+
}
|
|
@@ -165,7 +165,7 @@ const blockTypePlugin = ({
|
|
|
165
165
|
name: 'blockType',
|
|
166
166
|
plugin: ({
|
|
167
167
|
dispatch
|
|
168
|
-
}) => createPlugin(api, dispatch, options && options.lastNodeMustBeParagraph, options === null || options === void 0 ? void 0 : options.includeBlockQuoteAsTextstyleOption)
|
|
168
|
+
}) => createPlugin(api, dispatch, options && options.lastNodeMustBeParagraph, options === null || options === void 0 ? void 0 : options.includeBlockQuoteAsTextstyleOption, options === null || options === void 0 ? void 0 : options.allowFontSize)
|
|
169
169
|
}, {
|
|
170
170
|
name: 'blockTypeInputRule',
|
|
171
171
|
plugin: ({
|