@atlaskit/editor-plugin-breakout 3.0.4 → 3.0.5

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 (8) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/cjs/pm-plugins/get-guidelines.js +3 -1
  3. package/dist/cjs/pm-plugins/resizer-callbacks.js +4 -1
  4. package/dist/es2019/pm-plugins/get-guidelines.js +4 -2
  5. package/dist/es2019/pm-plugins/resizer-callbacks.js +5 -2
  6. package/dist/esm/pm-plugins/get-guidelines.js +4 -2
  7. package/dist/esm/pm-plugins/resizer-callbacks.js +5 -2
  8. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @atlaskit/editor-plugin-breakout
2
2
 
3
+ ## 3.0.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [#185940](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/185940)
8
+ [`456bee393c4d3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/456bee393c4d3) -
9
+ [ux] When editor-area is less than 768px wide, we reduce editor gutters to 24px in Full-page
10
+ editor.
11
+ - Updated dependencies
12
+
3
13
  ## 3.0.4
4
14
 
5
15
  ### Patch Changes
package/dist/cjs/pm-plugins/get-guidelines.js CHANGED
@@ -9,6 +9,7 @@ var _memoizeOne = _interopRequireDefault(require("memoize-one"));
9
9
  var _styles = require("@atlaskit/editor-common/styles");
10
10
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
11
11
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
12
+ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
12
13
  var WIDTHS = {
13
14
  MIN: _editorSharedStyles.akEditorDefaultLayoutWidth,
14
15
  WIDE: _editorSharedStyles.akEditorCalculatedWideLayoutWidth,
@@ -48,7 +49,8 @@ var getGuidelines = exports.getGuidelines = (0, _memoizeOne.default)(function (i
48
49
  var _ref = getEditorWidth() || {},
49
50
  width = _ref.width,
50
51
  lineLength = _ref.lineLength;
51
- var fullWidth = width ? Math.min(WIDTHS.MAX, width - 2 * (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() - _editorSharedStyles.akEditorGutterPadding) : undefined;
52
+ var padding = width && width <= _editorSharedStyles.akEditorFullPageNarrowBreakout && (0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? _editorSharedStyles.akEditorGutterPaddingReduced : (0, _editorSharedStyles.akEditorGutterPaddingDynamic)();
53
+ var fullWidth = width ? Math.min(WIDTHS.MAX, width - 2 * padding - _editorSharedStyles.akEditorGutterPadding) : undefined;
52
54
  if ((0, _platformFeatureFlags.fg)('platform_editor_breakout_resizing_hello_release')) {
53
55
  guidelines.push({
54
56
  key: GUIDELINE_KEYS.lineLengthLeft,
package/dist/cjs/pm-plugins/resizer-callbacks.js CHANGED
@@ -7,6 +7,7 @@ exports.createResizerCallbacks = createResizerCallbacks;
7
7
  exports.getProposedWidth = getProposedWidth;
8
8
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
9
9
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
10
+ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
10
11
  var _setBreakoutWidth = require("../editor-commands/set-breakout-width");
11
12
  var _getGuidelines = require("./get-guidelines");
12
13
  var _resizingMarkView = require("./resizing-mark-view");
@@ -28,7 +29,9 @@ function getProposedWidth(_ref) {
28
29
  source = _ref.source;
29
30
  var directionMultiplier = source.data.handleSide === 'left' ? -1 : 1;
30
31
  var diffX = (location.current.input.clientX - location.initial.input.clientX) * RESIZE_RATIO * directionMultiplier;
31
- var containerWidth = ((api === null || api === void 0 || (_api$width$sharedStat = api.width.sharedState) === null || _api$width$sharedStat === void 0 || (_api$width$sharedStat = _api$width$sharedStat.currentState()) === null || _api$width$sharedStat === void 0 ? void 0 : _api$width$sharedStat.width) || 0) - 2 * (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() - _editorSharedStyles.akEditorGutterPadding;
32
+ var width = (api === null || api === void 0 || (_api$width$sharedStat = api.width.sharedState) === null || _api$width$sharedStat === void 0 || (_api$width$sharedStat = _api$width$sharedStat.currentState()) === null || _api$width$sharedStat === void 0 ? void 0 : _api$width$sharedStat.width) || 0;
33
+ var padding = width <= _editorSharedStyles.akEditorFullPageNarrowBreakout && (0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? _editorSharedStyles.akEditorGutterPaddingReduced : (0, _editorSharedStyles.akEditorGutterPaddingDynamic)();
34
+ var containerWidth = width - 2 * padding - _editorSharedStyles.akEditorGutterPadding;
32
35
 
33
36
  // the node width may be greater than the container width so we resize using the smaller value
34
37
  var proposedWidth = Math.min(initialWidth, containerWidth) + diffX;
package/dist/es2019/pm-plugins/get-guidelines.js CHANGED
@@ -1,7 +1,8 @@
1
1
  import memoizeOne from 'memoize-one';
2
2
  import { EXPAND_CONTAINER_PADDING, LAYOUT_COLUMN_PADDING, resizerHandleThumbWidth } from '@atlaskit/editor-common/styles';
3
- import { akEditorGutterPaddingDynamic, akEditorGutterPadding, akEditorCalculatedWideLayoutWidth, akEditorFullWidthLayoutWidth, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
3
+ import { akEditorGutterPaddingDynamic, akEditorGutterPadding, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorCalculatedWideLayoutWidth, akEditorFullWidthLayoutWidth, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
4
4
  import { fg } from '@atlaskit/platform-feature-flags';
5
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
5
6
  const WIDTHS = {
6
7
  MIN: akEditorDefaultLayoutWidth,
7
8
  WIDE: akEditorCalculatedWideLayoutWidth,
@@ -39,7 +40,8 @@ export const getGuidelines = memoizeOne((isResizing, newWidth, getEditorWidth, n
39
40
  width,
40
41
  lineLength
41
42
  } = getEditorWidth() || {};
42
- const fullWidth = width ? Math.min(WIDTHS.MAX, width - 2 * akEditorGutterPaddingDynamic() - akEditorGutterPadding) : undefined;
43
+ const padding = width && width <= akEditorFullPageNarrowBreakout && expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? akEditorGutterPaddingReduced : akEditorGutterPaddingDynamic();
44
+ const fullWidth = width ? Math.min(WIDTHS.MAX, width - 2 * padding - akEditorGutterPadding) : undefined;
43
45
  if (fg('platform_editor_breakout_resizing_hello_release')) {
44
46
  guidelines.push({
45
47
  key: GUIDELINE_KEYS.lineLengthLeft,
package/dist/es2019/pm-plugins/resizer-callbacks.js CHANGED
@@ -1,5 +1,6 @@
1
- import { akEditorGutterPaddingDynamic, akEditorGutterPadding, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidth } from '@atlaskit/editor-shared-styles';
1
+ import { akEditorGutterPaddingDynamic, akEditorGutterPadding, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidth } from '@atlaskit/editor-shared-styles';
2
2
  import { fg } from '@atlaskit/platform-feature-flags';
3
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
3
4
  import { setBreakoutWidth } from '../editor-commands/set-breakout-width';
4
5
  import { getGuidelines } from './get-guidelines';
5
6
  import { LOCAL_RESIZE_PROPERTY } from './resizing-mark-view';
@@ -22,7 +23,9 @@ export function getProposedWidth({
22
23
  var _api$width$sharedStat, _api$width$sharedStat2;
23
24
  const directionMultiplier = source.data.handleSide === 'left' ? -1 : 1;
24
25
  const diffX = (location.current.input.clientX - location.initial.input.clientX) * RESIZE_RATIO * directionMultiplier;
25
- const containerWidth = ((api === null || api === void 0 ? void 0 : (_api$width$sharedStat = api.width.sharedState) === null || _api$width$sharedStat === void 0 ? void 0 : (_api$width$sharedStat2 = _api$width$sharedStat.currentState()) === null || _api$width$sharedStat2 === void 0 ? void 0 : _api$width$sharedStat2.width) || 0) - 2 * akEditorGutterPaddingDynamic() - akEditorGutterPadding;
26
+ const width = (api === null || api === void 0 ? void 0 : (_api$width$sharedStat = api.width.sharedState) === null || _api$width$sharedStat === void 0 ? void 0 : (_api$width$sharedStat2 = _api$width$sharedStat.currentState()) === null || _api$width$sharedStat2 === void 0 ? void 0 : _api$width$sharedStat2.width) || 0;
27
+ const padding = width <= akEditorFullPageNarrowBreakout && expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? akEditorGutterPaddingReduced : akEditorGutterPaddingDynamic();
28
+ const containerWidth = width - 2 * padding - akEditorGutterPadding;
26
29
 
27
30
  // the node width may be greater than the container width so we resize using the smaller value
28
31
  const proposedWidth = Math.min(initialWidth, containerWidth) + diffX;
package/dist/esm/pm-plugins/get-guidelines.js CHANGED
@@ -1,7 +1,8 @@
1
1
  import memoizeOne from 'memoize-one';
2
2
  import { EXPAND_CONTAINER_PADDING, LAYOUT_COLUMN_PADDING, resizerHandleThumbWidth } from '@atlaskit/editor-common/styles';
3
- import { akEditorGutterPaddingDynamic, akEditorGutterPadding, akEditorCalculatedWideLayoutWidth, akEditorFullWidthLayoutWidth, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
3
+ import { akEditorGutterPaddingDynamic, akEditorGutterPadding, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorCalculatedWideLayoutWidth, akEditorFullWidthLayoutWidth, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
4
4
  import { fg } from '@atlaskit/platform-feature-flags';
5
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
5
6
  var WIDTHS = {
6
7
  MIN: akEditorDefaultLayoutWidth,
7
8
  WIDE: akEditorCalculatedWideLayoutWidth,
@@ -41,7 +42,8 @@ export var getGuidelines = memoizeOne(function (isResizing, newWidth, getEditorW
41
42
  var _ref = getEditorWidth() || {},
42
43
  width = _ref.width,
43
44
  lineLength = _ref.lineLength;
44
- var fullWidth = width ? Math.min(WIDTHS.MAX, width - 2 * akEditorGutterPaddingDynamic() - akEditorGutterPadding) : undefined;
45
+ var padding = width && width <= akEditorFullPageNarrowBreakout && expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? akEditorGutterPaddingReduced : akEditorGutterPaddingDynamic();
46
+ var fullWidth = width ? Math.min(WIDTHS.MAX, width - 2 * padding - akEditorGutterPadding) : undefined;
45
47
  if (fg('platform_editor_breakout_resizing_hello_release')) {
46
48
  guidelines.push({
47
49
  key: GUIDELINE_KEYS.lineLengthLeft,
package/dist/esm/pm-plugins/resizer-callbacks.js CHANGED
@@ -1,5 +1,6 @@
1
- import { akEditorGutterPaddingDynamic, akEditorGutterPadding, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidth } from '@atlaskit/editor-shared-styles';
1
+ import { akEditorGutterPaddingDynamic, akEditorGutterPadding, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidth } from '@atlaskit/editor-shared-styles';
2
2
  import { fg } from '@atlaskit/platform-feature-flags';
3
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
3
4
  import { setBreakoutWidth } from '../editor-commands/set-breakout-width';
4
5
  import { getGuidelines } from './get-guidelines';
5
6
  import { LOCAL_RESIZE_PROPERTY } from './resizing-mark-view';
@@ -21,7 +22,9 @@ export function getProposedWidth(_ref) {
21
22
  source = _ref.source;
22
23
  var directionMultiplier = source.data.handleSide === 'left' ? -1 : 1;
23
24
  var diffX = (location.current.input.clientX - location.initial.input.clientX) * RESIZE_RATIO * directionMultiplier;
24
- var containerWidth = ((api === null || api === void 0 || (_api$width$sharedStat = api.width.sharedState) === null || _api$width$sharedStat === void 0 || (_api$width$sharedStat = _api$width$sharedStat.currentState()) === null || _api$width$sharedStat === void 0 ? void 0 : _api$width$sharedStat.width) || 0) - 2 * akEditorGutterPaddingDynamic() - akEditorGutterPadding;
25
+ var width = (api === null || api === void 0 || (_api$width$sharedStat = api.width.sharedState) === null || _api$width$sharedStat === void 0 || (_api$width$sharedStat = _api$width$sharedStat.currentState()) === null || _api$width$sharedStat === void 0 ? void 0 : _api$width$sharedStat.width) || 0;
26
+ var padding = width <= akEditorFullPageNarrowBreakout && expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? akEditorGutterPaddingReduced : akEditorGutterPaddingDynamic();
27
+ var containerWidth = width - 2 * padding - akEditorGutterPadding;
25
28
 
26
29
  // the node width may be greater than the container width so we resize using the smaller value
27
30
  var proposedWidth = Math.min(initialWidth, containerWidth) + diffX;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-breakout",
3
- "version": "3.0.4",
3
+ "version": "3.0.5",
4
4
  "description": "Breakout plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -41,12 +41,12 @@
41
41
  "@atlaskit/editor-plugin-user-intent": "^1.0.0",
42
42
  "@atlaskit/editor-plugin-width": "^4.0.0",
43
43
  "@atlaskit/editor-prosemirror": "7.0.0",
44
- "@atlaskit/editor-shared-styles": "^3.4.0",
44
+ "@atlaskit/editor-shared-styles": "^3.5.0",
45
45
  "@atlaskit/icon": "^27.3.0",
46
46
  "@atlaskit/platform-feature-flags": "^1.1.0",
47
47
  "@atlaskit/pragmatic-drag-and-drop": "^1.7.0",
48
48
  "@atlaskit/theme": "^19.0.0",
49
- "@atlaskit/tmp-editor-statsig": "^9.7.0",
49
+ "@atlaskit/tmp-editor-statsig": "^9.8.0",
50
50
  "@atlaskit/tokens": "^5.5.0",
51
51
  "@atlaskit/tooltip": "^20.3.0",
52
52
  "@babel/runtime": "^7.0.0",