@atlaskit/editor-core 187.29.3 → 187.30.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/dist/cjs/plugins/media/nodeviews/mediaSingle.js +9 -46
  3. package/dist/cjs/plugins/media/toolbar/index.js +14 -1
  4. package/dist/cjs/plugins/media/ui/PixelEntry/constants.js +8 -0
  5. package/dist/cjs/plugins/media/ui/PixelEntry/index.js +14 -1
  6. package/dist/cjs/plugins/media/ui/PixelEntry/messages.js +10 -0
  7. package/dist/cjs/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.js +26 -5
  8. package/dist/cjs/plugins/type-ahead/index.js +1 -0
  9. package/dist/cjs/version-wrapper.js +1 -1
  10. package/dist/es2019/plugins/media/nodeviews/mediaSingle.js +4 -41
  11. package/dist/es2019/plugins/media/toolbar/index.js +16 -2
  12. package/dist/es2019/plugins/media/ui/PixelEntry/constants.js +1 -0
  13. package/dist/es2019/plugins/media/ui/PixelEntry/index.js +14 -1
  14. package/dist/es2019/plugins/media/ui/PixelEntry/messages.js +10 -0
  15. package/dist/es2019/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.js +27 -5
  16. package/dist/es2019/plugins/type-ahead/index.js +1 -0
  17. package/dist/es2019/version-wrapper.js +1 -1
  18. package/dist/esm/plugins/media/nodeviews/mediaSingle.js +4 -41
  19. package/dist/esm/plugins/media/toolbar/index.js +15 -2
  20. package/dist/esm/plugins/media/ui/PixelEntry/constants.js +1 -0
  21. package/dist/esm/plugins/media/ui/PixelEntry/index.js +14 -1
  22. package/dist/esm/plugins/media/ui/PixelEntry/messages.js +10 -0
  23. package/dist/esm/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.js +26 -5
  24. package/dist/esm/plugins/type-ahead/index.js +1 -0
  25. package/dist/esm/version-wrapper.js +1 -1
  26. package/dist/types/labs/next/presets/default.d.ts +8 -8
  27. package/dist/types/plugins/emoji/index.d.ts +1 -1
  28. package/dist/types/plugins/media/nodeviews/mediaSingle.d.ts +0 -12
  29. package/dist/types/plugins/media/ui/PixelEntry/constants.d.ts +1 -0
  30. package/dist/types/plugins/media/ui/PixelEntry/index.d.ts +1 -1
  31. package/dist/types/plugins/media/ui/PixelEntry/messages.d.ts +10 -0
  32. package/dist/types/plugins/media/ui/PixelEntry/types.d.ts +8 -0
  33. package/dist/types/plugins/type-ahead/api.d.ts +2 -1
  34. package/dist/types/plugins/type-ahead/index.d.ts +2 -13
  35. package/dist/types/plugins/type-ahead/types.d.ts +2 -3
  36. package/dist/types-ts4.5/labs/next/presets/default.d.ts +8 -8
  37. package/dist/types-ts4.5/plugins/emoji/index.d.ts +1 -1
  38. package/dist/types-ts4.5/plugins/media/nodeviews/mediaSingle.d.ts +0 -12
  39. package/dist/types-ts4.5/plugins/media/ui/PixelEntry/constants.d.ts +1 -0
  40. package/dist/types-ts4.5/plugins/media/ui/PixelEntry/index.d.ts +1 -1
  41. package/dist/types-ts4.5/plugins/media/ui/PixelEntry/messages.d.ts +10 -0
  42. package/dist/types-ts4.5/plugins/media/ui/PixelEntry/types.d.ts +8 -0
  43. package/dist/types-ts4.5/plugins/type-ahead/api.d.ts +2 -1
  44. package/dist/types-ts4.5/plugins/type-ahead/index.d.ts +2 -13
  45. package/dist/types-ts4.5/plugins/type-ahead/types.d.ts +2 -3
  46. package/package.json +4 -3
  47. package/report.api.md +2 -14
  48. package/tmp/api-report-tmp.d.ts +2 -10
@@ -18,10 +18,9 @@ import { jsx } from '@emotion/react';
18
18
  import React, { Component } from 'react';
19
19
  import { WithProviders } from '@atlaskit/editor-common/provider-factory';
20
20
  import { MediaSingle } from '@atlaskit/editor-common/ui';
21
- import { browser, floatingLayouts, isRichMediaInsideOfBlockNode } from '@atlaskit/editor-common/utils';
21
+ import { browser } from '@atlaskit/editor-common/utils';
22
22
  import { isNodeSelectedOrInRange } from '../../../utils/nodes';
23
23
  import { setNodeSelection, setTextSelection } from '../../../utils';
24
- import { getParentWidthForNestedMediaSingleNode } from '../utils/media-single';
25
24
  import ResizableMediaSingleNext from '../ui/ResizableMediaSingle/ResizableMediaSingleNext';
26
25
  import ResizableMediaSingle from '../ui/ResizableMediaSingle';
27
26
  import { MEDIA_CONTENT_WRAP_CLASS_NAME } from '../pm-plugins/main';
@@ -37,7 +36,7 @@ import CaptionPlaceholder from '../ui/CaptionPlaceholder';
37
36
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
38
37
  import { insertAndSelectCaptionFromMediaSinglePos } from '../commands/captions';
39
38
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
40
- import { calcMediaSinglePixelWidth, MEDIA_SINGLE_GUTTER_SIZE, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/media-single';
39
+ import { calcMediaSinglePixelWidth, MEDIA_SINGLE_GUTTER_SIZE, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH, getMaxWidthForNestedNode, getMaxWidthForNestedNodeNext } from '@atlaskit/editor-common/media-single';
41
40
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
42
41
  var MediaSingleNode = /*#__PURE__*/function (_Component) {
43
42
  _inherits(MediaSingleNode, _Component);
@@ -242,42 +241,6 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
242
241
  }
243
242
  insertAndSelectCaptionFromMediaSinglePos(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d === void 0 ? void 0 : (_pluginInjectionApi$d2 = _pluginInjectionApi$d.analytics) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions)(getPos(), node)(view.state, view.dispatch);
244
243
  });
245
- /**
246
- * Get parent width for a nested media single node
247
- * @param view Editor view
248
- * @param pos node position
249
- */
250
- _defineProperty(_assertThisInitialized(_this), "getLineLength", function (view, pos, includeMoreParentNodeTypes) {
251
- if (typeof pos !== 'number') {
252
- return null;
253
- }
254
- if (isRichMediaInsideOfBlockNode(view, pos)) {
255
- var $pos = view.state.doc.resolve(pos);
256
- var domNode = view.nodeDOM($pos.pos);
257
- if ($pos.nodeAfter && floatingLayouts.indexOf($pos.nodeAfter.attrs.layout) > -1 && domNode && domNode.parentElement) {
258
- return domNode.parentElement.offsetWidth;
259
- }
260
- if (domNode instanceof HTMLElement) {
261
- return domNode.offsetWidth;
262
- }
263
- }
264
- return null;
265
- });
266
- /**
267
- * Get parent width for a nested media single node for new experience
268
- * @param view Editor view
269
- * @param pos node position
270
- */
271
- _defineProperty(_assertThisInitialized(_this), "getLineLengthNext", function (view, pos) {
272
- if (typeof pos !== 'number') {
273
- return null;
274
- }
275
- var $pos = view.state.doc.resolve(pos);
276
- if ($pos && $pos.parent.type.name !== 'doc') {
277
- return getParentWidthForNestedMediaSingleNode($pos, view);
278
- }
279
- return null;
280
- });
281
244
  return _this;
282
245
  }
283
246
  _createClass(MediaSingleNode, [{
@@ -378,8 +341,8 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
378
341
  height = DEFAULT_IMAGE_HEIGHT;
379
342
  }
380
343
  var isSelected = selected();
381
- var contentWidthForLegacyExperience = this.getLineLength(view, getPos()) || lineLength;
382
- var contentWidth = this.getLineLengthNext(view, getPos()) || lineLength;
344
+ var contentWidthForLegacyExperience = getMaxWidthForNestedNode(view, getPos()) || lineLength;
345
+ var contentWidth = getMaxWidthForNestedNodeNext(view, getPos()) || lineLength;
383
346
  var mediaSingleProps = {
384
347
  layout: layout,
385
348
  width: width,
@@ -29,7 +29,7 @@ import ImageBorderItem from '../ui/ImageBorder';
29
29
  import { currentMediaNodeBorderMark } from '../utils/current-media-node';
30
30
  import { shouldShowImageBorder } from './imageBorder';
31
31
  import { PixelEntry } from '../ui/PixelEntry';
32
- import { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_GUTTER_SIZE, calcMediaSinglePixelWidth } from '@atlaskit/editor-common/media-single';
32
+ import { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_GUTTER_SIZE, calcMediaSinglePixelWidth, getMaxWidthForNestedNode } from '@atlaskit/editor-common/media-single';
33
33
  import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
34
34
  var remove = function remove(state, dispatch) {
35
35
  if (dispatch) {
@@ -281,18 +281,20 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
281
281
  var _selectedMediaNode$at = selectedMediaNode.attrs,
282
282
  mediaWidth = _selectedMediaNode$at.width,
283
283
  mediaHeight = _selectedMediaNode$at.height;
284
+ var isLegacy = widthType !== 'pixel';
284
285
  var pixelWidth = calcMediaSinglePixelWidth({
285
286
  width: singleMediaWidth,
286
287
  widthType: widthType,
287
288
  origWidth: mediaWidth || DEFAULT_IMAGE_WIDTH,
288
289
  layout: layout,
289
- contentWidth: contentWidth,
290
+ contentWidth: getMaxWidthForNestedNode(editorView, selectedMediaSingleNode.pos) || contentWidth,
290
291
  containerWidth: containerWidth,
291
292
  gutterOffset: MEDIA_SINGLE_GUTTER_SIZE
292
293
  });
293
294
  return /*#__PURE__*/React.createElement(PixelEntry, {
294
295
  intl: intl,
295
296
  width: pluginState.isResizing ? pluginState.resizingWidth : pixelWidth,
297
+ showMigration: !pluginState.isResizing && isLegacy,
296
298
  mediaWidth: mediaWidth || DEFAULT_IMAGE_WIDTH,
297
299
  mediaHeight: mediaHeight || DEFAULT_IMAGE_HEIGHT,
298
300
  validate: function validate(value) {
@@ -307,6 +309,17 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
307
309
  width: width,
308
310
  widthType: 'pixel'
309
311
  }));
312
+ tr.setMeta('scrollIntoView', false);
313
+ tr.setSelection(NodeSelection.create(tr.doc, selectedMediaSingleNode.pos));
314
+ dispatch(tr);
315
+ },
316
+ onMigrate: function onMigrate() {
317
+ var tr = state.tr.setNodeMarkup(selectedMediaSingleNode.pos, undefined, _objectSpread(_objectSpread({}, selectedMediaSingleNode.node.attrs), {}, {
318
+ width: pixelWidth,
319
+ widthType: 'pixel'
320
+ }));
321
+ tr.setMeta('scrollIntoView', false);
322
+ tr.setSelection(NodeSelection.create(tr.doc, selectedMediaSingleNode.pos));
310
323
  dispatch(tr);
311
324
  }
312
325
  });
@@ -0,0 +1 @@
1
+ export var PIXELENTRY_MIGRATION_BUTTON_TESTID = 'pixel-entry-convert-pixels-btn';
@@ -9,13 +9,16 @@ import Button from '@atlaskit/button';
9
9
  import Form, { Field } from '@atlaskit/form';
10
10
  import { pixelSizingInput, pixelSizingLabel, pixelSizingWidthInput, pixelSizingHeightInput, pixelSizingWrapper, pixelEntryForm, pixelEntryHiddenSubmit } from './styles';
11
11
  import { messages } from './messages';
12
+ import { PIXELENTRY_MIGRATION_BUTTON_TESTID } from './constants';
12
13
  export var PixelEntry = function PixelEntry(_ref) {
13
14
  var width = _ref.width,
14
15
  mediaWidth = _ref.mediaWidth,
15
16
  mediaHeight = _ref.mediaHeight,
16
17
  onSubmit = _ref.onSubmit,
17
18
  validate = _ref.validate,
18
- formatMessage = _ref.intl.formatMessage;
19
+ formatMessage = _ref.intl.formatMessage,
20
+ showMigration = _ref.showMigration,
21
+ onMigrate = _ref.onMigrate;
19
22
  var ratioWidth = useMemo(function () {
20
23
  return mediaHeight / mediaWidth;
21
24
  }, [mediaHeight, mediaWidth]);
@@ -85,6 +88,16 @@ export var PixelEntry = function PixelEntry(_ref) {
85
88
  }
86
89
  };
87
90
  }, [ratioHeight, ratioWidth]);
91
+ if (showMigration) {
92
+ return jsx(Tooltip, {
93
+ content: formatMessage(messages.migrationButtonTooltip)
94
+ }, jsx(Button, {
95
+ appearance: "warning",
96
+ spacing: "compact",
97
+ onClick: onMigrate,
98
+ testId: PIXELENTRY_MIGRATION_BUTTON_TESTID
99
+ }, formatMessage(messages.migrationButtonText)));
100
+ }
88
101
  return jsx("div", {
89
102
  css: pixelEntryForm
90
103
  }, jsx(Form, {
@@ -29,5 +29,15 @@ export var messages = defineMessages({
29
29
  id: 'fabric.editor.media.pixelEntry.submitButtonText',
30
30
  defaultMessage: 'Submit',
31
31
  description: 'The text give to the hidden submit button'
32
+ },
33
+ migrationButtonText: {
34
+ id: 'fabric.editor.media.pixelEntry.migrationButtonText',
35
+ defaultMessage: 'Convert to pixels',
36
+ description: 'The text give to the button used to covert to pixels for legacy experience'
37
+ },
38
+ migrationButtonTooltip: {
39
+ id: 'fabric.editor.media.pixelEntry.migrationButtonTooltip',
40
+ defaultMessage: 'Migrate from percentage to fixed pixel sizing',
41
+ description: 'The tooltip displayed on the migration button'
32
42
  }
33
43
  });
@@ -29,6 +29,16 @@ import { getMediaResizeAnalyticsEvent } from '../../utils/analytics';
29
29
  import throttle from 'lodash/throttle';
30
30
  import { MEDIA_PLUGIN_IS_RESIZING_KEY, MEDIA_PLUGIN_RESIZING_WIDTH_KEY } from '../../pm-plugins/main';
31
31
  export var resizerNextTestId = 'mediaSingle.resizerNext.testid';
32
+ var handleComponent = {
33
+ left: jsx("div", {
34
+ "data-testid": "richMedia-resize-handle-left-elem",
35
+ contentEditable: false
36
+ }),
37
+ right: jsx("div", {
38
+ "data-testid": "richMedia-resize-handle-right-elem",
39
+ contentEditable: false
40
+ })
41
+ };
32
42
  var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
33
43
  _inherits(ResizableMediaSingleNext, _React$Component);
34
44
  var _super = _createSuper(ResizableMediaSingleNext);
@@ -146,11 +156,18 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
146
156
  return Math.min(contentWidth || akEditorDefaultLayoutWidth, isVideoFile ? MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH : MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH);
147
157
  }));
148
158
  _defineProperty(_assertThisInitialized(_this), "getRelativeGuides", function () {
159
+ var _this$props$pluginInj5, _this$props$pluginInj6, _this$props$pluginInj7, _this$props$pluginInj8;
160
+ var guidelinePluginState = (_this$props$pluginInj5 = _this.props.pluginInjectionApi) === null || _this$props$pluginInj5 === void 0 ? void 0 : (_this$props$pluginInj6 = _this$props$pluginInj5.dependencies) === null || _this$props$pluginInj6 === void 0 ? void 0 : (_this$props$pluginInj7 = _this$props$pluginInj6.guideline) === null || _this$props$pluginInj7 === void 0 ? void 0 : (_this$props$pluginInj8 = _this$props$pluginInj7.sharedState) === null || _this$props$pluginInj8 === void 0 ? void 0 : _this$props$pluginInj8.currentState();
161
+ var _ref = (guidelinePluginState === null || guidelinePluginState === void 0 ? void 0 : guidelinePluginState.rect) || {
162
+ top: 0,
163
+ left: 0
164
+ },
165
+ topOffset = _ref.top;
149
166
  var $pos = _this.$pos;
150
167
  var relativeGuides = $pos && $pos.nodeAfter && _this.state.size.width ? getRelativeGuidelines(_this.state.relativeGuides, {
151
168
  node: $pos.nodeAfter,
152
169
  pos: $pos.pos
153
- }, _this.props.view, _this.props.lineLength, _this.state.size) : [];
170
+ }, _this.props.view, _this.props.lineLength, topOffset, _this.state.size) : [];
154
171
  return relativeGuides;
155
172
  });
156
173
  _defineProperty(_assertThisInitialized(_this), "updateActiveGuidelines", function () {
@@ -178,8 +195,10 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
178
195
  });
179
196
  _defineProperty(_assertThisInitialized(_this), "selectCurrentMediaNode", function () {
180
197
  // TODO: if adding !this.props.selected, it doesn't work if media single node is at top postion
181
- var pos = _this.pos;
182
- pos && setNodeSelection(_this.props.view, pos);
198
+ if (_this.pos === null) {
199
+ return;
200
+ }
201
+ setNodeSelection(_this.props.view, _this.pos);
183
202
  });
184
203
  _defineProperty(_assertThisInitialized(_this), "handleResizeStart", function () {
185
204
  _this.setState({
@@ -406,7 +425,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
406
425
  key: "isNestedNode",
407
426
  value: function isNestedNode() {
408
427
  var $pos = this.$pos;
409
- return !!($pos && $pos.parent.type !== $pos.parent.type.schema.nodes.doc);
428
+ return !!($pos && $pos.depth !== 0);
410
429
  }
411
430
  }, {
412
431
  key: "getDefaultGuidelines",
@@ -530,7 +549,9 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
530
549
  handleResizeStop: this.handleResizeStop,
531
550
  snap: this.state.snaps,
532
551
  resizeRatio: nonWrappedLayouts.includes(layout) ? 2 : 1,
533
- "data-testid": resizerNextTestId
552
+ handleComponent: handleComponent,
553
+ "data-testid": resizerNextTestId,
554
+ isHandleVisible: selected
534
555
  }, children));
535
556
  }
536
557
  }]);
@@ -104,6 +104,7 @@ var TypeAheadMenu = /*#__PURE__*/React.memo(function (_ref) {
104
104
  cancel: cancel
105
105
  });
106
106
  });
107
+
107
108
  /**
108
109
  *
109
110
  * Revamped typeahead using decorations instead of the `typeAheadQuery` mark
@@ -1,5 +1,5 @@
1
1
  export var name = "@atlaskit/editor-core";
2
- export var version = "187.29.3";
2
+ export var version = "187.30.0";
3
3
  export var nextMajorVersion = function nextMajorVersion() {
4
4
  return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
5
5
  };
@@ -221,18 +221,18 @@ export declare function createDefaultPreset(options: EditorPresetProps & Default
221
221
  }>, (config?: undefined, api?: import("@atlaskit/editor-common/types").PluginInjectionAPI<"unsupportedContent", {}> | undefined) => import("@atlaskit/editor-common/types").DefaultEditorPlugin<"unsupportedContent", {}>, (config?: TypeAheadPluginOptions | undefined, api?: import("@atlaskit/editor-common/types").PluginInjectionAPI<"typeAhead", {
222
222
  pluginConfiguration: TypeAheadPluginOptions | undefined;
223
223
  commands: {
224
- openTypeAheadAtCursor: ({ triggerHandler, inputMethod, query }: {
224
+ openTypeAheadAtCursor: (props: {
225
225
  triggerHandler: import("@atlaskit/editor-common/types").TypeAheadHandler;
226
- inputMethod: import("../../../plugins/type-ahead/types").TypeAheadInputMethod;
226
+ inputMethod: import("@atlaskit/editor-plugin-type-ahead").TypeAheadInputMethod;
227
227
  query?: string | undefined;
228
228
  }) => import("@atlaskit/editor-common/types").EditorCommand;
229
229
  };
230
230
  }> | undefined) => import("@atlaskit/editor-common/types").DefaultEditorPlugin<"typeAhead", {
231
231
  pluginConfiguration: TypeAheadPluginOptions | undefined;
232
232
  commands: {
233
- openTypeAheadAtCursor: ({ triggerHandler, inputMethod, query }: {
233
+ openTypeAheadAtCursor: (props: {
234
234
  triggerHandler: import("@atlaskit/editor-common/types").TypeAheadHandler;
235
- inputMethod: import("../../../plugins/type-ahead/types").TypeAheadInputMethod;
235
+ inputMethod: import("@atlaskit/editor-plugin-type-ahead").TypeAheadInputMethod;
236
236
  query?: string | undefined;
237
237
  }) => import("@atlaskit/editor-common/types").EditorCommand;
238
238
  };
@@ -606,18 +606,18 @@ export declare function useDefaultPreset(props: EditorPresetProps & DefaultPrese
606
606
  }>, (config?: undefined, api?: import("@atlaskit/editor-common/types").PluginInjectionAPI<"unsupportedContent", {}> | undefined) => import("@atlaskit/editor-common/types").DefaultEditorPlugin<"unsupportedContent", {}>, (config?: TypeAheadPluginOptions | undefined, api?: import("@atlaskit/editor-common/types").PluginInjectionAPI<"typeAhead", {
607
607
  pluginConfiguration: TypeAheadPluginOptions | undefined;
608
608
  commands: {
609
- openTypeAheadAtCursor: ({ triggerHandler, inputMethod, query }: {
609
+ openTypeAheadAtCursor: (props: {
610
610
  triggerHandler: import("@atlaskit/editor-common/types").TypeAheadHandler;
611
- inputMethod: import("../../../plugins/type-ahead/types").TypeAheadInputMethod;
611
+ inputMethod: import("@atlaskit/editor-plugin-type-ahead").TypeAheadInputMethod;
612
612
  query?: string | undefined;
613
613
  }) => import("@atlaskit/editor-common/types").EditorCommand;
614
614
  };
615
615
  }> | undefined) => import("@atlaskit/editor-common/types").DefaultEditorPlugin<"typeAhead", {
616
616
  pluginConfiguration: TypeAheadPluginOptions | undefined;
617
617
  commands: {
618
- openTypeAheadAtCursor: ({ triggerHandler, inputMethod, query }: {
618
+ openTypeAheadAtCursor: (props: {
619
619
  triggerHandler: import("@atlaskit/editor-common/types").TypeAheadHandler;
620
- inputMethod: import("../../../plugins/type-ahead/types").TypeAheadInputMethod;
620
+ inputMethod: import("@atlaskit/editor-plugin-type-ahead").TypeAheadInputMethod;
621
621
  query?: string | undefined;
622
622
  }) => import("@atlaskit/editor-common/types").EditorCommand;
623
623
  };
@@ -7,7 +7,7 @@ import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
7
7
  import type { TypeAheadItem } from '../type-ahead/types';
8
8
  import type { EmojiPluginOptions, EmojiPluginState } from './types';
9
9
  import type { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
10
- import type { TypeAheadPlugin } from '../type-ahead';
10
+ import type { TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
11
11
  export declare const emojiToTypeaheadItem: (emoji: EmojiDescription, emojiProvider?: EmojiProvider) => TypeAheadItem;
12
12
  export declare function memoize<ResultFn extends (emoji: EmojiDescription, emojiProvider?: EmojiProvider) => TypeAheadItem>(fn: ResultFn): {
13
13
  call: ResultFn;
@@ -41,18 +41,6 @@ export default class MediaSingleNode extends Component<MediaSingleNodeProps, Med
41
41
  onMediaSingleClicked: (event: MouseEvent) => void;
42
42
  render(): jsx.JSX.Element;
43
43
  private clickPlaceholder;
44
- /**
45
- * Get parent width for a nested media single node
46
- * @param view Editor view
47
- * @param pos node position
48
- */
49
- private getLineLength;
50
- /**
51
- * Get parent width for a nested media single node for new experience
52
- * @param view Editor view
53
- * @param pos node position
54
- */
55
- private getLineLengthNext;
56
44
  }
57
45
  declare class MediaSingleNodeView extends ReactNodeView<MediaSingleNodeViewProps> {
58
46
  lastOffsetLeft: number;
@@ -0,0 +1 @@
1
+ export declare const PIXELENTRY_MIGRATION_BUTTON_TESTID = "pixel-entry-convert-pixels-btn";
@@ -1,4 +1,4 @@
1
1
  /** @jsx jsx */
2
2
  import { jsx } from '@emotion/react';
3
3
  import type { PixelEntryProps } from './types';
4
- export declare const PixelEntry: ({ width, mediaWidth, mediaHeight, onSubmit, validate, intl: { formatMessage }, }: PixelEntryProps) => jsx.JSX.Element;
4
+ export declare const PixelEntry: ({ width, mediaWidth, mediaHeight, onSubmit, validate, intl: { formatMessage }, showMigration, onMigrate, }: PixelEntryProps) => jsx.JSX.Element;
@@ -29,4 +29,14 @@ export declare const messages: {
29
29
  defaultMessage: string;
30
30
  description: string;
31
31
  };
32
+ migrationButtonText: {
33
+ id: string;
34
+ defaultMessage: string;
35
+ description: string;
36
+ };
37
+ migrationButtonTooltip: {
38
+ id: string;
39
+ defaultMessage: string;
40
+ description: string;
41
+ };
32
42
  };
@@ -16,6 +16,10 @@ export type PixelEntryProps = {
16
16
  * The original media height used to calculate the width
17
17
  */
18
18
  mediaHeight: number;
19
+ /**
20
+ * show migration button to convert to pixels for legacy image resize experience
21
+ */
22
+ showMigration?: boolean;
19
23
  /**
20
24
  * The submit function that is called when the form is valid and the submit key is pressed
21
25
  */
@@ -25,6 +29,10 @@ export type PixelEntryProps = {
25
29
  * The value passed through the validator currently comes from the width input only.
26
30
  */
27
31
  validate?: (value: number | '') => boolean;
32
+ /**
33
+ * Migration handler called when the CTA button is clicked
34
+ */
35
+ onMigrate?: () => void;
28
36
  };
29
37
  export type PixelEntryFormValues = {
30
38
  inputWidth: number | '';
@@ -2,7 +2,8 @@ import type { EditorView } from '@atlaskit/editor-prosemirror/view';
2
2
  import type { Transaction } from '@atlaskit/editor-prosemirror/state';
3
3
  import type { TypeAheadItem } from '@atlaskit/editor-common/provider-factory';
4
4
  import { SelectItemMode } from '@atlaskit/editor-common/type-ahead';
5
- import type { TypeAheadHandler, TypeAheadInputMethod } from './types';
5
+ import type { TypeAheadInputMethod } from '@atlaskit/editor-plugin-type-ahead';
6
+ import type { TypeAheadHandler } from './types';
6
7
  import type { Command } from '../../types/command';
7
8
  type CloseOptions = {
8
9
  insertCurrentQueryAsRawText: boolean;
@@ -1,17 +1,6 @@
1
- import type { NextEditorPlugin } from '../../types/editor-plugin';
2
- import type { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next/types';
3
1
  import { pluginKey as typeAheadPluginKey } from './pm-plugins/key';
4
- import { openTypeAheadAtCursor } from './transforms/open-typeahead-at-cursor';
5
- export type TypeAheadPluginOptions = {
6
- isMobile?: boolean;
7
- createAnalyticsEvent?: CreateUIAnalyticsEvent;
8
- };
9
- export type TypeAheadPlugin = NextEditorPlugin<'typeAhead', {
10
- pluginConfiguration: TypeAheadPluginOptions | undefined;
11
- commands: {
12
- openTypeAheadAtCursor: typeof openTypeAheadAtCursor;
13
- };
14
- }>;
2
+ import type { TypeAheadPluginOptions, TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
3
+ export type { TypeAheadPluginOptions, TypeAheadPlugin };
15
4
  /**
16
5
  *
17
6
  * Revamped typeahead using decorations instead of the `typeAheadQuery` mark
@@ -1,11 +1,11 @@
1
1
  import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
2
2
  import type { EditorState, Transaction, ReadonlyTransaction } from '@atlaskit/editor-prosemirror/state';
3
- import type { INPUT_METHOD } from '../analytics/types/enums';
4
3
  import type { CloseSelectionOptions } from './constants';
5
4
  import type { UiComponentFactoryParams } from '../../types/ui-components';
6
5
  import type { SelectItemMode } from '@atlaskit/editor-common/type-ahead';
7
6
  import type { TypeAheadStats, TypeAheadItemRenderProps, TypeAheadInsert, TypeAheadSelectItem, TypeAheadItem, TypeAheadForceSelect, TypeAheadHandler } from '@atlaskit/editor-common/types';
8
- export type { TypeAheadStats, TypeAheadItemRenderProps, TypeAheadInsert, TypeAheadSelectItem, TypeAheadItem, TypeAheadForceSelect, TypeAheadHandler, };
7
+ import type { TypeAheadInputMethod } from '@atlaskit/editor-plugin-type-ahead';
8
+ export type { TypeAheadStats, TypeAheadItemRenderProps, TypeAheadInsert, TypeAheadSelectItem, TypeAheadItem, TypeAheadForceSelect, TypeAheadHandler, TypeAheadInputMethod, };
9
9
  export type OnSelectItem = (props: {
10
10
  index: number;
11
11
  item: TypeAheadItem;
@@ -49,7 +49,6 @@ export type OnTextInsertProps = {
49
49
  text: string;
50
50
  };
51
51
  export type OnTextInsert = (props: OnTextInsertProps) => void;
52
- export type TypeAheadInputMethod = INPUT_METHOD.INSERT_MENU | INPUT_METHOD.KEYBOARD | INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR;
53
52
  export type InsertionTransactionMeta = (editorState: EditorState) => Transaction | false;
54
53
  type PopupMountPoints = Pick<UiComponentFactoryParams, 'popupsMountPoint' | 'popupsBoundariesElement' | 'popupsScrollableElement'>;
55
54
  export type PopupMountPointReference = Record<'current', PopupMountPoints | null>;
@@ -269,18 +269,18 @@ export declare function createDefaultPreset(options: EditorPresetProps & Default
269
269
  (config?: TypeAheadPluginOptions | undefined, api?: import("@atlaskit/editor-common/types").PluginInjectionAPI<"typeAhead", {
270
270
  pluginConfiguration: TypeAheadPluginOptions | undefined;
271
271
  commands: {
272
- openTypeAheadAtCursor: ({ triggerHandler, inputMethod, query }: {
272
+ openTypeAheadAtCursor: (props: {
273
273
  triggerHandler: import("@atlaskit/editor-common/types").TypeAheadHandler;
274
- inputMethod: import("../../../plugins/type-ahead/types").TypeAheadInputMethod;
274
+ inputMethod: import("@atlaskit/editor-plugin-type-ahead").TypeAheadInputMethod;
275
275
  query?: string | undefined;
276
276
  }) => import("@atlaskit/editor-common/types").EditorCommand;
277
277
  };
278
278
  }> | undefined) => import("@atlaskit/editor-common/types").DefaultEditorPlugin<"typeAhead", {
279
279
  pluginConfiguration: TypeAheadPluginOptions | undefined;
280
280
  commands: {
281
- openTypeAheadAtCursor: ({ triggerHandler, inputMethod, query }: {
281
+ openTypeAheadAtCursor: (props: {
282
282
  triggerHandler: import("@atlaskit/editor-common/types").TypeAheadHandler;
283
- inputMethod: import("../../../plugins/type-ahead/types").TypeAheadInputMethod;
283
+ inputMethod: import("@atlaskit/editor-plugin-type-ahead").TypeAheadInputMethod;
284
284
  query?: string | undefined;
285
285
  }) => import("@atlaskit/editor-common/types").EditorCommand;
286
286
  };
@@ -734,18 +734,18 @@ export declare function useDefaultPreset(props: EditorPresetProps & DefaultPrese
734
734
  (config?: TypeAheadPluginOptions | undefined, api?: import("@atlaskit/editor-common/types").PluginInjectionAPI<"typeAhead", {
735
735
  pluginConfiguration: TypeAheadPluginOptions | undefined;
736
736
  commands: {
737
- openTypeAheadAtCursor: ({ triggerHandler, inputMethod, query }: {
737
+ openTypeAheadAtCursor: (props: {
738
738
  triggerHandler: import("@atlaskit/editor-common/types").TypeAheadHandler;
739
- inputMethod: import("../../../plugins/type-ahead/types").TypeAheadInputMethod;
739
+ inputMethod: import("@atlaskit/editor-plugin-type-ahead").TypeAheadInputMethod;
740
740
  query?: string | undefined;
741
741
  }) => import("@atlaskit/editor-common/types").EditorCommand;
742
742
  };
743
743
  }> | undefined) => import("@atlaskit/editor-common/types").DefaultEditorPlugin<"typeAhead", {
744
744
  pluginConfiguration: TypeAheadPluginOptions | undefined;
745
745
  commands: {
746
- openTypeAheadAtCursor: ({ triggerHandler, inputMethod, query }: {
746
+ openTypeAheadAtCursor: (props: {
747
747
  triggerHandler: import("@atlaskit/editor-common/types").TypeAheadHandler;
748
- inputMethod: import("../../../plugins/type-ahead/types").TypeAheadInputMethod;
748
+ inputMethod: import("@atlaskit/editor-plugin-type-ahead").TypeAheadInputMethod;
749
749
  query?: string | undefined;
750
750
  }) => import("@atlaskit/editor-common/types").EditorCommand;
751
751
  };
@@ -7,7 +7,7 @@ import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
7
7
  import type { TypeAheadItem } from '../type-ahead/types';
8
8
  import type { EmojiPluginOptions, EmojiPluginState } from './types';
9
9
  import type { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
10
- import type { TypeAheadPlugin } from '../type-ahead';
10
+ import type { TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
11
11
  export declare const emojiToTypeaheadItem: (emoji: EmojiDescription, emojiProvider?: EmojiProvider) => TypeAheadItem;
12
12
  export declare function memoize<ResultFn extends (emoji: EmojiDescription, emojiProvider?: EmojiProvider) => TypeAheadItem>(fn: ResultFn): {
13
13
  call: ResultFn;
@@ -41,18 +41,6 @@ export default class MediaSingleNode extends Component<MediaSingleNodeProps, Med
41
41
  onMediaSingleClicked: (event: MouseEvent) => void;
42
42
  render(): jsx.JSX.Element;
43
43
  private clickPlaceholder;
44
- /**
45
- * Get parent width for a nested media single node
46
- * @param view Editor view
47
- * @param pos node position
48
- */
49
- private getLineLength;
50
- /**
51
- * Get parent width for a nested media single node for new experience
52
- * @param view Editor view
53
- * @param pos node position
54
- */
55
- private getLineLengthNext;
56
44
  }
57
45
  declare class MediaSingleNodeView extends ReactNodeView<MediaSingleNodeViewProps> {
58
46
  lastOffsetLeft: number;
@@ -0,0 +1 @@
1
+ export declare const PIXELENTRY_MIGRATION_BUTTON_TESTID = "pixel-entry-convert-pixels-btn";
@@ -1,4 +1,4 @@
1
1
  /** @jsx jsx */
2
2
  import { jsx } from '@emotion/react';
3
3
  import type { PixelEntryProps } from './types';
4
- export declare const PixelEntry: ({ width, mediaWidth, mediaHeight, onSubmit, validate, intl: { formatMessage }, }: PixelEntryProps) => jsx.JSX.Element;
4
+ export declare const PixelEntry: ({ width, mediaWidth, mediaHeight, onSubmit, validate, intl: { formatMessage }, showMigration, onMigrate, }: PixelEntryProps) => jsx.JSX.Element;
@@ -29,4 +29,14 @@ export declare const messages: {
29
29
  defaultMessage: string;
30
30
  description: string;
31
31
  };
32
+ migrationButtonText: {
33
+ id: string;
34
+ defaultMessage: string;
35
+ description: string;
36
+ };
37
+ migrationButtonTooltip: {
38
+ id: string;
39
+ defaultMessage: string;
40
+ description: string;
41
+ };
32
42
  };
@@ -16,6 +16,10 @@ export type PixelEntryProps = {
16
16
  * The original media height used to calculate the width
17
17
  */
18
18
  mediaHeight: number;
19
+ /**
20
+ * show migration button to convert to pixels for legacy image resize experience
21
+ */
22
+ showMigration?: boolean;
19
23
  /**
20
24
  * The submit function that is called when the form is valid and the submit key is pressed
21
25
  */
@@ -25,6 +29,10 @@ export type PixelEntryProps = {
25
29
  * The value passed through the validator currently comes from the width input only.
26
30
  */
27
31
  validate?: (value: number | '') => boolean;
32
+ /**
33
+ * Migration handler called when the CTA button is clicked
34
+ */
35
+ onMigrate?: () => void;
28
36
  };
29
37
  export type PixelEntryFormValues = {
30
38
  inputWidth: number | '';
@@ -2,7 +2,8 @@ import type { EditorView } from '@atlaskit/editor-prosemirror/view';
2
2
  import type { Transaction } from '@atlaskit/editor-prosemirror/state';
3
3
  import type { TypeAheadItem } from '@atlaskit/editor-common/provider-factory';
4
4
  import { SelectItemMode } from '@atlaskit/editor-common/type-ahead';
5
- import type { TypeAheadHandler, TypeAheadInputMethod } from './types';
5
+ import type { TypeAheadInputMethod } from '@atlaskit/editor-plugin-type-ahead';
6
+ import type { TypeAheadHandler } from './types';
6
7
  import type { Command } from '../../types/command';
7
8
  type CloseOptions = {
8
9
  insertCurrentQueryAsRawText: boolean;
@@ -1,17 +1,6 @@
1
- import type { NextEditorPlugin } from '../../types/editor-plugin';
2
- import type { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next/types';
3
1
  import { pluginKey as typeAheadPluginKey } from './pm-plugins/key';
4
- import { openTypeAheadAtCursor } from './transforms/open-typeahead-at-cursor';
5
- export type TypeAheadPluginOptions = {
6
- isMobile?: boolean;
7
- createAnalyticsEvent?: CreateUIAnalyticsEvent;
8
- };
9
- export type TypeAheadPlugin = NextEditorPlugin<'typeAhead', {
10
- pluginConfiguration: TypeAheadPluginOptions | undefined;
11
- commands: {
12
- openTypeAheadAtCursor: typeof openTypeAheadAtCursor;
13
- };
14
- }>;
2
+ import type { TypeAheadPluginOptions, TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
3
+ export type { TypeAheadPluginOptions, TypeAheadPlugin };
15
4
  /**
16
5
  *
17
6
  * Revamped typeahead using decorations instead of the `typeAheadQuery` mark
@@ -1,11 +1,11 @@
1
1
  import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
2
2
  import type { EditorState, Transaction, ReadonlyTransaction } from '@atlaskit/editor-prosemirror/state';
3
- import type { INPUT_METHOD } from '../analytics/types/enums';
4
3
  import type { CloseSelectionOptions } from './constants';
5
4
  import type { UiComponentFactoryParams } from '../../types/ui-components';
6
5
  import type { SelectItemMode } from '@atlaskit/editor-common/type-ahead';
7
6
  import type { TypeAheadStats, TypeAheadItemRenderProps, TypeAheadInsert, TypeAheadSelectItem, TypeAheadItem, TypeAheadForceSelect, TypeAheadHandler } from '@atlaskit/editor-common/types';
8
- export type { TypeAheadStats, TypeAheadItemRenderProps, TypeAheadInsert, TypeAheadSelectItem, TypeAheadItem, TypeAheadForceSelect, TypeAheadHandler, };
7
+ import type { TypeAheadInputMethod } from '@atlaskit/editor-plugin-type-ahead';
8
+ export type { TypeAheadStats, TypeAheadItemRenderProps, TypeAheadInsert, TypeAheadSelectItem, TypeAheadItem, TypeAheadForceSelect, TypeAheadHandler, TypeAheadInputMethod, };
9
9
  export type OnSelectItem = (props: {
10
10
  index: number;
11
11
  item: TypeAheadItem;
@@ -49,7 +49,6 @@ export type OnTextInsertProps = {
49
49
  text: string;
50
50
  };
51
51
  export type OnTextInsert = (props: OnTextInsertProps) => void;
52
- export type TypeAheadInputMethod = INPUT_METHOD.INSERT_MENU | INPUT_METHOD.KEYBOARD | INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR;
53
52
  export type InsertionTransactionMeta = (editorState: EditorState) => Transaction | false;
54
53
  type PopupMountPoints = Pick<UiComponentFactoryParams, 'popupsMountPoint' | 'popupsBoundariesElement' | 'popupsScrollableElement'>;
55
54
  export type PopupMountPointReference = Record<'current', PopupMountPoints | null>;