@atlaskit/editor-plugin-code-block 14.1.0 → 14.1.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/editor-plugin-code-block
2
2
 
3
+ ## 14.1.2
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 14.1.1
10
+
11
+ ### Patch Changes
12
+
13
+ - [`5bb7d8aa14c4e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5bb7d8aa14c4e) -
14
+ Fix code block language picker trigger height in legacy toolbar
15
+ - [`49b8e9a322976`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/49b8e9a322976) -
16
+ Reduce q4 lovability experiment exposure noise in code block setup and bookkeeping paths
17
+ - Updated dependencies
18
+
3
19
  ## 14.1.0
4
20
 
5
21
  ### Minor Changes
@@ -14,7 +14,6 @@ var _blockMenu = require("@atlaskit/editor-common/block-menu");
14
14
  var _messages = require("@atlaskit/editor-common/messages");
15
15
  var _quickInsert = require("@atlaskit/editor-common/quick-insert");
16
16
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
17
- var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
18
17
  var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
19
18
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
20
19
  var _editorCommands = require("./editor-commands");
@@ -58,7 +57,7 @@ var codeBlockPlugin = function codeBlockPlugin(_ref) {
58
57
  nodes: function nodes() {
59
58
  return [{
60
59
  name: 'codeBlock',
61
- node: (0, _expValEquals.expValEquals)('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? _adfSchema.codeBlock : (0, _platformFeatureFlags.fg)('platform_editor_adf_with_localid') ? _adfSchema.codeBlockWithLocalId : _adfSchema.codeBlock
60
+ node: (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? _adfSchema.codeBlock : (0, _platformFeatureFlags.fg)('platform_editor_adf_with_localid') ? _adfSchema.codeBlockWithLocalId : _adfSchema.codeBlock
62
61
  }];
63
62
  },
64
63
  getSharedState: function getSharedState(state) {
@@ -90,7 +89,7 @@ var codeBlockPlugin = function codeBlockPlugin(_ref) {
90
89
  var schema = _ref3.schema;
91
90
  return (0, _inputRule.createCodeBlockInputRule)(schema, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions);
92
91
  }
93
- }].concat((0, _toConsumableArray2.default)((0, _expValEquals.expValEquals)('platform_editor_code_block_q4_lovability', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_code_block_language_detection_flow') ? [{
92
+ }].concat((0, _toConsumableArray2.default)((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_code_block_q4_lovability', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_code_block_language_detection_flow') ? [{
94
93
  name: 'codeBlockAutoDetect',
95
94
  plugin: function plugin() {
96
95
  return (0, _autoDetect.createAutoDetectPlugin)(api);
@@ -15,6 +15,7 @@ var _transforms = require("@atlaskit/editor-common/transforms");
15
15
  var _state = require("@atlaskit/editor-prosemirror/state");
16
16
  var _view = require("@atlaskit/editor-prosemirror/view");
17
17
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
18
+ var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
18
19
  var _editorCommands = require("../editor-commands");
19
20
  var _codeBlock2 = require("../nodeviews/code-block");
20
21
  var _classNames = require("../ui/class-names");
@@ -130,7 +131,7 @@ var createPlugin = exports.createPlugin = function createPlugin(_ref) {
130
131
  isNodeSelected: tr.selection instanceof _state.NodeSelection,
131
132
  decorations: updatedDecorationSet
132
133
  });
133
- if (!(0, _expValEquals.expValEquals)('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
134
+ if (!(0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
134
135
  return newPluginState;
135
136
  }
136
137
 
@@ -158,7 +159,7 @@ var createPlugin = exports.createPlugin = function createPlugin(_ref) {
158
159
  shouldIgnoreFollowingMutations: meta.data
159
160
  });
160
161
  }
161
- if ((0, _expValEquals.expValEquals)('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
162
+ if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
162
163
  // Failed/unchanged format results and dismissals are meta-only.
163
164
  return (0, _formatCodeState.applyFormatCodeMeta)(pluginState, meta);
164
165
  }
@@ -20,6 +20,7 @@ var _listNumbered = _interopRequireDefault(require("@atlaskit/icon/core/list-num
20
20
  var _textWrap = _interopRequireDefault(require("@atlaskit/icon/core/text-wrap"));
21
21
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
22
22
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
23
+ var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
23
24
  var _editorCommands = require("../editor-commands");
24
25
  var _CodeBlockLanguagePicker = require("../ui/CodeBlockLanguagePicker");
25
26
  var _WrapIcon = require("../ui/icons/WrapIcon");
@@ -143,6 +144,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig() {
143
144
  options: languageSelectOptions,
144
145
  filterOption: languageListFilter
145
146
  };
147
+ var areAnyNewToolbarFlagsEnabled = (0, _toolbarFlagCheck.areToolbarFlagsEnabled)(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
146
148
  var languagePicker;
147
149
  if ((0, _expValEquals.expValEquals)('platform_editor_code_block_q4_lovability', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_code_block_add_line_number_button')) {
148
150
  var autoDetectEntry = typeof localId === 'string' && (0, _platformFeatureFlags.fg)('platform_editor_code_block_language_detection_flow') ? autoDetectState === null || autoDetectState === void 0 ? void 0 : autoDetectState.languageDetectionMap[localId] : undefined;
@@ -165,7 +167,8 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig() {
165
167
  editorView: view,
166
168
  filterOption: languageListFilter,
167
169
  formatMessage: formatMessage,
168
- languagePickerOptions: languagePickerOptions
170
+ languagePickerOptions: languagePickerOptions,
171
+ triggerSpacing: !areAnyNewToolbarFlagsEnabled && (0, _platformFeatureFlags.fg)('platform_editor_code_block_dogfooding_patch') ? 'compact' : 'default'
169
172
  });
170
173
  }
171
174
  };
@@ -173,7 +176,6 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig() {
173
176
  var separator = {
174
177
  type: 'separator'
175
178
  };
176
- var areAnyNewToolbarFlagsEnabled = (0, _toolbarFlagCheck.areToolbarFlagsEnabled)(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
177
179
  var copyToClipboardItems = !allowCopyToClipboard ? [] : [{
178
180
  id: 'editor.codeBlock.copy',
179
181
  type: 'button',
@@ -246,12 +248,12 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig() {
246
248
  };
247
249
  copyAndDeleteButtonMenuItems = [separator].concat(copyToClipboardItems, [deleteButton]);
248
250
  }
249
- var codeBlockWrapButtonTitle = (0, _expValEquals.expValEquals)('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? formatMessage(isWrapped ? _messages.codeBlockButtonMessages.unwrapCodeLabel : _messages.codeBlockButtonMessages.wrapCodeLabel) : formatMessage(_messages.codeBlockButtonMessages.wrapCode);
251
+ var codeBlockWrapButtonTitle = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? formatMessage(isWrapped ? _messages.codeBlockButtonMessages.unwrapCodeLabel : _messages.codeBlockButtonMessages.wrapCodeLabel) : formatMessage(_messages.codeBlockButtonMessages.wrapCode);
250
252
  var codeBlockWrapButton = {
251
253
  id: 'editor.codeBlock.wrap',
252
254
  type: 'button',
253
255
  // Toggling button now writes to ADF, hence it should be available in view mode
254
- supportsViewMode: !(0, _expValEquals.expValEquals)('platform_editor_code_block_q4_lovability', 'isEnabled', true),
256
+ supportsViewMode: !(0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_code_block_q4_lovability', 'isEnabled', true),
255
257
  icon: _textWrap.default,
256
258
  iconFallback: _WrapIcon.WrapIcon,
257
259
  onClick: (0, _editorCommands.toggleWordWrapStateForCodeBlockNode)(editorAnalyticsAPI),
@@ -21,7 +21,8 @@ var CodeBlockLanguagePicker = exports.CodeBlockLanguagePicker = function CodeBlo
21
21
  editorView = _ref.editorView,
22
22
  filterOption = _ref.filterOption,
23
23
  formatMessage = _ref.formatMessage,
24
- languagePickerOptions = _ref.languagePickerOptions;
24
+ languagePickerOptions = _ref.languagePickerOptions,
25
+ triggerSpacing = _ref.triggerSpacing;
25
26
  var _useState = (0, _react.useState)(function () {
26
27
  return (0, _recentLanguages.getRecentLanguages)();
27
28
  }),
@@ -55,6 +56,7 @@ var CodeBlockLanguagePicker = exports.CodeBlockLanguagePicker = function CodeBlo
55
56
  languagePickerOptions: languagePickerOptions,
56
57
  recentLanguageValues: recentLanguageValues,
57
58
  onMenuOpen: refreshRecentLanguages,
58
- onSelection: handleSelection
59
+ onSelection: handleSelection,
60
+ triggerSpacing: triggerSpacing
59
61
  });
60
62
  };
@@ -95,7 +95,9 @@ var LanguagePicker = exports.LanguagePicker = function LanguagePicker(_ref) {
95
95
  _ref$recentLanguageVa = _ref.recentLanguageValues,
96
96
  recentLanguageValues = _ref$recentLanguageVa === void 0 ? [] : _ref$recentLanguageVa,
97
97
  onMenuOpen = _ref.onMenuOpen,
98
- onSelection = _ref.onSelection;
98
+ onSelection = _ref.onSelection,
99
+ _ref$triggerSpacing = _ref.triggerSpacing,
100
+ triggerSpacing = _ref$triggerSpacing === void 0 ? 'default' : _ref$triggerSpacing;
99
101
  var label = (_defaultValue$label = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.label) !== null && _defaultValue$label !== void 0 ? _defaultValue$label : formatMessage(_messages.codeBlockButtonMessages.selectLanguage);
100
102
  var selectLanguageLabel = formatMessage(_messages.codeBlockButtonMessages.selectLanguage);
101
103
  var _useState = (0, _react.useState)(false),
@@ -198,6 +200,7 @@ var LanguagePicker = exports.LanguagePicker = function LanguagePicker(_ref) {
198
200
  return /*#__PURE__*/_react.default.createElement("div", {
199
201
  className: (0, _runtime.ax)([styles.trigger])
200
202
  }, /*#__PURE__*/_react.default.createElement(_new.default, {
203
+ spacing: triggerSpacing,
201
204
  shouldFitContainer: true,
202
205
  onMouseDown: handleTriggerMouseDown,
203
206
  onKeyDown: onKeyDown,
@@ -208,7 +211,7 @@ var LanguagePicker = exports.LanguagePicker = function LanguagePicker(_ref) {
208
211
  "aria-controls": ariaControls,
209
212
  testId: "code-block-language-picker-trigger"
210
213
  }, label));
211
- }, [handleTriggerMouseDown, label]);
214
+ }, [label, triggerSpacing, handleTriggerMouseDown]);
212
215
  return /*#__PURE__*/_react.default.createElement(_select.PopupSelect, {
213
216
  components: popupSelectComponents,
214
217
  filterOption: filterOption,
@@ -5,7 +5,6 @@ import { TRANSFORM_STRUCTURE_MENU_SECTION, TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_I
5
5
  import { blockTypeMessages } from '@atlaskit/editor-common/messages';
6
6
  import { IconCode } from '@atlaskit/editor-common/quick-insert';
7
7
  import { fg } from '@atlaskit/platform-feature-flags';
8
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
9
8
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
10
9
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
11
10
  import { createInsertCodeBlockTransaction, insertCodeBlockWithAnalytics } from './editor-commands';
@@ -48,7 +47,7 @@ const codeBlockPlugin = ({
48
47
  nodes() {
49
48
  return [{
50
49
  name: 'codeBlock',
51
- node: expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? codeBlock : fg('platform_editor_adf_with_localid') ? codeBlockWithLocalId : codeBlock
50
+ node: expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? codeBlock : fg('platform_editor_adf_with_localid') ? codeBlockWithLocalId : codeBlock
52
51
  }];
53
52
  },
54
53
  getSharedState(state) {
@@ -81,7 +80,7 @@ const codeBlockPlugin = ({
81
80
  var _api$analytics;
82
81
  return createCodeBlockInputRule(schema, api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions);
83
82
  }
84
- }, ...(expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) && fg('platform_editor_code_block_language_detection_flow') ? [{
83
+ }, ...(expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true) && fg('platform_editor_code_block_language_detection_flow') ? [{
85
84
  name: 'codeBlockAutoDetect',
86
85
  plugin: () => createAutoDetectPlugin(api)
87
86
  }] : []), {
@@ -7,6 +7,7 @@ import { findCodeBlock } from '@atlaskit/editor-common/transforms';
7
7
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
8
8
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
9
9
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
10
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
10
11
  import { ignoreFollowingMutations, resetShouldIgnoreFollowingMutations } from '../editor-commands';
11
12
  import { codeBlockNodeView } from '../nodeviews/code-block';
12
13
  import { codeBlockClassNames } from '../ui/class-names';
@@ -119,7 +120,7 @@ export const createPlugin = ({
119
120
  isNodeSelected: tr.selection instanceof NodeSelection,
120
121
  decorations: updatedDecorationSet
121
122
  };
122
- if (!expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
123
+ if (!expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
123
124
  return newPluginState;
124
125
  }
125
126
 
@@ -151,7 +152,7 @@ export const createPlugin = ({
151
152
  shouldIgnoreFollowingMutations: meta.data
152
153
  };
153
154
  }
154
- if (expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
155
+ if (expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
155
156
  // Failed/unchanged format results and dismissals are meta-only.
156
157
  return applyFormatCodeMeta(pluginState, meta);
157
158
  }
@@ -10,6 +10,7 @@ import ListNumberedIcon from '@atlaskit/icon/core/list-numbered';
10
10
  import TextWrapIcon from '@atlaskit/icon/core/text-wrap';
11
11
  import { fg } from '@atlaskit/platform-feature-flags';
12
12
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
13
14
  import { changeLanguage, copyContentToClipboardWithAnalytics, createFormatCodeOnClick, removeCodeBlockWithAnalytics, resetCopiedState, toggleLineNumbersForCodeBlockNode, toggleWordWrapStateForCodeBlockNode } from '../editor-commands';
14
15
  import { CodeBlockLanguagePicker } from '../ui/CodeBlockLanguagePicker';
15
16
  import { WrapIcon } from '../ui/icons/WrapIcon';
@@ -113,6 +114,7 @@ export const getToolbarConfig = (allowCopyToClipboard = false, api, overrideLang
113
114
  options: languageSelectOptions,
114
115
  filterOption: languageListFilter
115
116
  };
117
+ const areAnyNewToolbarFlagsEnabled = areToolbarFlagsEnabled(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
116
118
  let languagePicker;
117
119
  if (expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) && fg('platform_editor_code_block_add_line_number_button')) {
118
120
  const autoDetectEntry = typeof localId === 'string' && fg('platform_editor_code_block_language_detection_flow') ? autoDetectState === null || autoDetectState === void 0 ? void 0 : autoDetectState.languageDetectionMap[localId] : undefined;
@@ -135,7 +137,8 @@ export const getToolbarConfig = (allowCopyToClipboard = false, api, overrideLang
135
137
  editorView: view,
136
138
  filterOption: languageListFilter,
137
139
  formatMessage: formatMessage,
138
- languagePickerOptions: languagePickerOptions
140
+ languagePickerOptions: languagePickerOptions,
141
+ triggerSpacing: !areAnyNewToolbarFlagsEnabled && fg('platform_editor_code_block_dogfooding_patch') ? 'compact' : 'default'
139
142
  });
140
143
  }
141
144
  };
@@ -143,7 +146,6 @@ export const getToolbarConfig = (allowCopyToClipboard = false, api, overrideLang
143
146
  const separator = {
144
147
  type: 'separator'
145
148
  };
146
- const areAnyNewToolbarFlagsEnabled = areToolbarFlagsEnabled(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
147
149
  const copyToClipboardItems = !allowCopyToClipboard ? [] : [{
148
150
  id: 'editor.codeBlock.copy',
149
151
  type: 'button',
@@ -216,12 +218,12 @@ export const getToolbarConfig = (allowCopyToClipboard = false, api, overrideLang
216
218
  };
217
219
  copyAndDeleteButtonMenuItems = [separator, ...copyToClipboardItems, deleteButton];
218
220
  }
219
- const codeBlockWrapButtonTitle = expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? formatMessage(isWrapped ? codeBlockButtonMessages.unwrapCodeLabel : codeBlockButtonMessages.wrapCodeLabel) : formatMessage(codeBlockButtonMessages.wrapCode);
221
+ const codeBlockWrapButtonTitle = expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? formatMessage(isWrapped ? codeBlockButtonMessages.unwrapCodeLabel : codeBlockButtonMessages.wrapCodeLabel) : formatMessage(codeBlockButtonMessages.wrapCode);
220
222
  const codeBlockWrapButton = {
221
223
  id: 'editor.codeBlock.wrap',
222
224
  type: 'button',
223
225
  // Toggling button now writes to ADF, hence it should be available in view mode
224
- supportsViewMode: !expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true),
226
+ supportsViewMode: !expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true),
225
227
  icon: TextWrapIcon,
226
228
  iconFallback: WrapIcon,
227
229
  onClick: toggleWordWrapStateForCodeBlockNode(editorAnalyticsAPI),
@@ -10,7 +10,8 @@ export const CodeBlockLanguagePicker = ({
10
10
  editorView,
11
11
  filterOption,
12
12
  formatMessage,
13
- languagePickerOptions
13
+ languagePickerOptions,
14
+ triggerSpacing
14
15
  }) => {
15
16
  var _api$analytics2;
16
17
  const [recentLanguageValues, setRecentLanguageValues] = useState(() => getRecentLanguages());
@@ -41,6 +42,7 @@ export const CodeBlockLanguagePicker = ({
41
42
  languagePickerOptions: languagePickerOptions,
42
43
  recentLanguageValues: recentLanguageValues,
43
44
  onMenuOpen: refreshRecentLanguages,
44
- onSelection: handleSelection
45
+ onSelection: handleSelection,
46
+ triggerSpacing: triggerSpacing
45
47
  });
46
48
  };
@@ -70,7 +70,8 @@ export const LanguagePicker = ({
70
70
  languagePickerOptions,
71
71
  recentLanguageValues = [],
72
72
  onMenuOpen,
73
- onSelection
73
+ onSelection,
74
+ triggerSpacing = 'default'
74
75
  }) => {
75
76
  var _defaultValue$label;
76
77
  const label = (_defaultValue$label = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.label) !== null && _defaultValue$label !== void 0 ? _defaultValue$label : formatMessage(codeBlockButtonMessages.selectLanguage);
@@ -156,6 +157,7 @@ export const LanguagePicker = ({
156
157
  }) => /*#__PURE__*/React.createElement("div", {
157
158
  className: ax([styles.trigger])
158
159
  }, /*#__PURE__*/React.createElement(Button, {
160
+ spacing: triggerSpacing,
159
161
  shouldFitContainer: true,
160
162
  onMouseDown: handleTriggerMouseDown,
161
163
  onKeyDown: onKeyDown,
@@ -165,7 +167,7 @@ export const LanguagePicker = ({
165
167
  isSelected: isOpen,
166
168
  "aria-controls": ariaControls,
167
169
  testId: "code-block-language-picker-trigger"
168
- }, label)), [handleTriggerMouseDown, label]);
170
+ }, label)), [label, triggerSpacing, handleTriggerMouseDown]);
169
171
  return /*#__PURE__*/React.createElement(PopupSelect, {
170
172
  components: popupSelectComponents,
171
173
  filterOption: filterOption,
@@ -9,7 +9,6 @@ import { TRANSFORM_STRUCTURE_MENU_SECTION, TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_I
9
9
  import { blockTypeMessages } from '@atlaskit/editor-common/messages';
10
10
  import { IconCode } from '@atlaskit/editor-common/quick-insert';
11
11
  import { fg } from '@atlaskit/platform-feature-flags';
12
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
12
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
14
13
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
15
14
  import { createInsertCodeBlockTransaction, insertCodeBlockWithAnalytics } from './editor-commands';
@@ -51,7 +50,7 @@ var codeBlockPlugin = function codeBlockPlugin(_ref) {
51
50
  nodes: function nodes() {
52
51
  return [{
53
52
  name: 'codeBlock',
54
- node: expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? codeBlock : fg('platform_editor_adf_with_localid') ? codeBlockWithLocalId : codeBlock
53
+ node: expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? codeBlock : fg('platform_editor_adf_with_localid') ? codeBlockWithLocalId : codeBlock
55
54
  }];
56
55
  },
57
56
  getSharedState: function getSharedState(state) {
@@ -83,7 +82,7 @@ var codeBlockPlugin = function codeBlockPlugin(_ref) {
83
82
  var schema = _ref3.schema;
84
83
  return createCodeBlockInputRule(schema, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions);
85
84
  }
86
- }].concat(_toConsumableArray(expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) && fg('platform_editor_code_block_language_detection_flow') ? [{
85
+ }].concat(_toConsumableArray(expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true) && fg('platform_editor_code_block_language_detection_flow') ? [{
87
86
  name: 'codeBlockAutoDetect',
88
87
  plugin: function plugin() {
89
88
  return createAutoDetectPlugin(api);
@@ -10,6 +10,7 @@ import { findCodeBlock } from '@atlaskit/editor-common/transforms';
10
10
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
11
11
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
12
12
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
13
14
  import { ignoreFollowingMutations, resetShouldIgnoreFollowingMutations } from '../editor-commands';
14
15
  import { codeBlockNodeView } from '../nodeviews/code-block';
15
16
  import { codeBlockClassNames } from '../ui/class-names';
@@ -123,7 +124,7 @@ export var createPlugin = function createPlugin(_ref) {
123
124
  isNodeSelected: tr.selection instanceof NodeSelection,
124
125
  decorations: updatedDecorationSet
125
126
  });
126
- if (!expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
127
+ if (!expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
127
128
  return newPluginState;
128
129
  }
129
130
 
@@ -151,7 +152,7 @@ export var createPlugin = function createPlugin(_ref) {
151
152
  shouldIgnoreFollowingMutations: meta.data
152
153
  });
153
154
  }
154
- if (expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
155
+ if (expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true)) {
155
156
  // Failed/unchanged format results and dismissals are meta-only.
156
157
  return applyFormatCodeMeta(pluginState, meta);
157
158
  }
@@ -14,6 +14,7 @@ import ListNumberedIcon from '@atlaskit/icon/core/list-numbered';
14
14
  import TextWrapIcon from '@atlaskit/icon/core/text-wrap';
15
15
  import { fg } from '@atlaskit/platform-feature-flags';
16
16
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
17
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
17
18
  import { changeLanguage, copyContentToClipboardWithAnalytics, createFormatCodeOnClick, removeCodeBlockWithAnalytics, resetCopiedState, toggleLineNumbersForCodeBlockNode, toggleWordWrapStateForCodeBlockNode } from '../editor-commands';
18
19
  import { CodeBlockLanguagePicker } from '../ui/CodeBlockLanguagePicker';
19
20
  import { WrapIcon } from '../ui/icons/WrapIcon';
@@ -134,6 +135,7 @@ export var getToolbarConfig = function getToolbarConfig() {
134
135
  options: languageSelectOptions,
135
136
  filterOption: languageListFilter
136
137
  };
138
+ var areAnyNewToolbarFlagsEnabled = areToolbarFlagsEnabled(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
137
139
  var languagePicker;
138
140
  if (expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) && fg('platform_editor_code_block_add_line_number_button')) {
139
141
  var autoDetectEntry = typeof localId === 'string' && fg('platform_editor_code_block_language_detection_flow') ? autoDetectState === null || autoDetectState === void 0 ? void 0 : autoDetectState.languageDetectionMap[localId] : undefined;
@@ -156,7 +158,8 @@ export var getToolbarConfig = function getToolbarConfig() {
156
158
  editorView: view,
157
159
  filterOption: languageListFilter,
158
160
  formatMessage: formatMessage,
159
- languagePickerOptions: languagePickerOptions
161
+ languagePickerOptions: languagePickerOptions,
162
+ triggerSpacing: !areAnyNewToolbarFlagsEnabled && fg('platform_editor_code_block_dogfooding_patch') ? 'compact' : 'default'
160
163
  });
161
164
  }
162
165
  };
@@ -164,7 +167,6 @@ export var getToolbarConfig = function getToolbarConfig() {
164
167
  var separator = {
165
168
  type: 'separator'
166
169
  };
167
- var areAnyNewToolbarFlagsEnabled = areToolbarFlagsEnabled(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
168
170
  var copyToClipboardItems = !allowCopyToClipboard ? [] : [{
169
171
  id: 'editor.codeBlock.copy',
170
172
  type: 'button',
@@ -237,12 +239,12 @@ export var getToolbarConfig = function getToolbarConfig() {
237
239
  };
238
240
  copyAndDeleteButtonMenuItems = [separator].concat(copyToClipboardItems, [deleteButton]);
239
241
  }
240
- var codeBlockWrapButtonTitle = expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? formatMessage(isWrapped ? codeBlockButtonMessages.unwrapCodeLabel : codeBlockButtonMessages.wrapCodeLabel) : formatMessage(codeBlockButtonMessages.wrapCode);
242
+ var codeBlockWrapButtonTitle = expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true) ? formatMessage(isWrapped ? codeBlockButtonMessages.unwrapCodeLabel : codeBlockButtonMessages.wrapCodeLabel) : formatMessage(codeBlockButtonMessages.wrapCode);
241
243
  var codeBlockWrapButton = {
242
244
  id: 'editor.codeBlock.wrap',
243
245
  type: 'button',
244
246
  // Toggling button now writes to ADF, hence it should be available in view mode
245
- supportsViewMode: !expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true),
247
+ supportsViewMode: !expValEqualsNoExposure('platform_editor_code_block_q4_lovability', 'isEnabled', true),
246
248
  icon: TextWrapIcon,
247
249
  iconFallback: WrapIcon,
248
250
  onClick: toggleWordWrapStateForCodeBlockNode(editorAnalyticsAPI),
@@ -12,7 +12,8 @@ export var CodeBlockLanguagePicker = function CodeBlockLanguagePicker(_ref) {
12
12
  editorView = _ref.editorView,
13
13
  filterOption = _ref.filterOption,
14
14
  formatMessage = _ref.formatMessage,
15
- languagePickerOptions = _ref.languagePickerOptions;
15
+ languagePickerOptions = _ref.languagePickerOptions,
16
+ triggerSpacing = _ref.triggerSpacing;
16
17
  var _useState = useState(function () {
17
18
  return getRecentLanguages();
18
19
  }),
@@ -46,6 +47,7 @@ export var CodeBlockLanguagePicker = function CodeBlockLanguagePicker(_ref) {
46
47
  languagePickerOptions: languagePickerOptions,
47
48
  recentLanguageValues: recentLanguageValues,
48
49
  onMenuOpen: refreshRecentLanguages,
49
- onSelection: handleSelection
50
+ onSelection: handleSelection,
51
+ triggerSpacing: triggerSpacing
50
52
  });
51
53
  };
@@ -86,7 +86,9 @@ export var LanguagePicker = function LanguagePicker(_ref) {
86
86
  _ref$recentLanguageVa = _ref.recentLanguageValues,
87
87
  recentLanguageValues = _ref$recentLanguageVa === void 0 ? [] : _ref$recentLanguageVa,
88
88
  onMenuOpen = _ref.onMenuOpen,
89
- onSelection = _ref.onSelection;
89
+ onSelection = _ref.onSelection,
90
+ _ref$triggerSpacing = _ref.triggerSpacing,
91
+ triggerSpacing = _ref$triggerSpacing === void 0 ? 'default' : _ref$triggerSpacing;
90
92
  var label = (_defaultValue$label = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.label) !== null && _defaultValue$label !== void 0 ? _defaultValue$label : formatMessage(codeBlockButtonMessages.selectLanguage);
91
93
  var selectLanguageLabel = formatMessage(codeBlockButtonMessages.selectLanguage);
92
94
  var _useState = useState(false),
@@ -189,6 +191,7 @@ export var LanguagePicker = function LanguagePicker(_ref) {
189
191
  return /*#__PURE__*/React.createElement("div", {
190
192
  className: ax([styles.trigger])
191
193
  }, /*#__PURE__*/React.createElement(Button, {
194
+ spacing: triggerSpacing,
192
195
  shouldFitContainer: true,
193
196
  onMouseDown: handleTriggerMouseDown,
194
197
  onKeyDown: onKeyDown,
@@ -199,7 +202,7 @@ export var LanguagePicker = function LanguagePicker(_ref) {
199
202
  "aria-controls": ariaControls,
200
203
  testId: "code-block-language-picker-trigger"
201
204
  }, label));
202
- }, [handleTriggerMouseDown, label]);
205
+ }, [label, triggerSpacing, handleTriggerMouseDown]);
203
206
  return /*#__PURE__*/React.createElement(PopupSelect, {
204
207
  components: popupSelectComponents,
205
208
  filterOption: filterOption,
@@ -7,5 +7,5 @@ type CodeBlockLanguagePickerProps = Omit<LanguagePickerProps, 'recentLanguageVal
7
7
  api: ExtractInjectionAPI<CodeBlockPlugin> | undefined;
8
8
  editorView: EditorView;
9
9
  };
10
- export declare const CodeBlockLanguagePicker: ({ api, defaultValue, editorView, filterOption, formatMessage, languagePickerOptions, }: CodeBlockLanguagePickerProps) => React.JSX.Element;
10
+ export declare const CodeBlockLanguagePicker: ({ api, defaultValue, editorView, filterOption, formatMessage, languagePickerOptions, triggerSpacing, }: CodeBlockLanguagePickerProps) => React.JSX.Element;
11
11
  export {};
@@ -14,5 +14,6 @@ export type LanguagePickerProps = {
14
14
  onMenuOpen?: () => void;
15
15
  onSelection: (option: LanguagePickerOption, selectionSource: LanguagePickerSelectionSource) => void;
16
16
  recentLanguageValues?: string[];
17
+ triggerSpacing?: 'default' | 'compact';
17
18
  };
18
- export declare const LanguagePicker: ({ defaultValue, filterOption, formatMessage, languagePickerOptions, recentLanguageValues, onMenuOpen, onSelection, }: LanguagePickerProps) => React.JSX.Element;
19
+ export declare const LanguagePicker: ({ defaultValue, filterOption, formatMessage, languagePickerOptions, recentLanguageValues, onMenuOpen, onSelection, triggerSpacing, }: LanguagePickerProps) => React.JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-code-block",
3
- "version": "14.1.0",
3
+ "version": "14.1.2",
4
4
  "description": "Code block plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -42,13 +42,13 @@
42
42
  "@atlaskit/primitives": "^20.0.0",
43
43
  "@atlaskit/prosemirror-input-rules": "^4.0.0",
44
44
  "@atlaskit/select": "^22.1.0",
45
- "@atlaskit/tmp-editor-statsig": "^110.0.0",
45
+ "@atlaskit/tmp-editor-statsig": "^112.0.0",
46
46
  "@atlaskit/tokens": "^15.0.0",
47
47
  "@babel/runtime": "^7.0.0",
48
48
  "@compiled/react": "^0.20.0"
49
49
  },
50
50
  "peerDependencies": {
51
- "@atlaskit/editor-common": "^116.11.0",
51
+ "@atlaskit/editor-common": "^116.12.0",
52
52
  "react": "^18.2.0",
53
53
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
54
54
  },