@atlaskit/editor-plugin-floating-toolbar 4.1.16 → 4.1.18

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 (13) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/cjs/pm-plugins/commands.js +1 -2
  3. package/dist/cjs/ui/EmojiPickerButton.js +11 -3
  4. package/dist/cjs/ui/Toolbar.js +1 -0
  5. package/dist/es2019/pm-plugins/commands.js +1 -2
  6. package/dist/es2019/ui/EmojiPickerButton.js +11 -3
  7. package/dist/es2019/ui/Toolbar.js +1 -0
  8. package/dist/esm/pm-plugins/commands.js +1 -2
  9. package/dist/esm/ui/EmojiPickerButton.js +11 -3
  10. package/dist/esm/ui/Toolbar.js +1 -0
  11. package/dist/types/ui/EmojiPickerButton.d.ts +1 -0
  12. package/dist/types-ts4.5/ui/EmojiPickerButton.d.ts +1 -0
  13. package/package.json +9 -9
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-floating-toolbar
2
2
 
3
+ ## 4.1.18
4
+
5
+ ### Patch Changes
6
+
7
+ - [#165113](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/165113)
8
+ [`867bcb05452bf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/867bcb05452bf) -
9
+ Cleaned up platform_editor_controls_patch_analytics and platform_editor_controls_patch_analytics_2
10
+ - Updated dependencies
11
+
12
+ ## 4.1.17
13
+
14
+ ### Patch Changes
15
+
16
+ - [#165950](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/165950)
17
+ [`39b41cc2930ca`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/39b41cc2930ca) -
18
+ [ux] [ED-28185] Force panel emoji picker to go below toolbar when there isn't enough space above
19
+ or below to fit whole picker
20
+
3
21
  ## 4.1.16
4
22
 
5
23
  ### Patch Changes
package/dist/cjs/pm-plugins/commands.js CHANGED
@@ -8,7 +8,6 @@ var _browser = require("@atlaskit/editor-common/browser");
8
8
  var _clipboard = require("@atlaskit/editor-common/clipboard");
9
9
  var _copyButton = require("@atlaskit/editor-common/copy-button");
10
10
  var _state = require("@atlaskit/editor-prosemirror/state");
11
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
12
11
  var copyNode = exports.copyNode = function copyNode(nodeType, editorAnalyticsApi, inputMethod) {
13
12
  return function (_ref) {
14
13
  var tr = _ref.tr;
@@ -54,7 +53,7 @@ var copyNode = exports.copyNode = function copyNode(nodeType, editorAnalyticsApi
54
53
  (0, _clipboard.copyHTMLToClipboard)(div);
55
54
  }
56
55
  }
57
- if (editorAnalyticsApi && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_analytics_2')) {
56
+ if (editorAnalyticsApi) {
58
57
  var analyticsPayload = (0, _clipboard.getNodeCopiedAnalyticsPayload)(contentNodeWithPos.node, inputMethod);
59
58
  editorAnalyticsApi.attachAnalyticsEvent(analyticsPayload)(copyToClipboardTr);
60
59
  }
package/dist/cjs/ui/EmojiPickerButton.js CHANGED
@@ -82,6 +82,12 @@ var EmojiPickerWithProvider = function EmojiPickerWithProvider(props) {
82
82
  onPickerRef: setOutsideClickTargetRef
83
83
  });
84
84
  };
85
+
86
+ // Note: These are based on the height and width of the emoji picker at the time
87
+ // of writing (2025-05-05). It is 100% prone to change but at least it's vaguely
88
+ // written down.
89
+ var EMOJI_PICKER_MAX_HEIGHT = 431;
90
+ var EMOJI_PICKER_MAX_WIDTH = 352;
85
91
  var EmojiPickerWithListener = (0, _uiReact.withReactEditorViewOuterListeners)(EmojiPickerWithProvider);
86
92
  var EmojiPickerButton = exports.EmojiPickerButton = function EmojiPickerButton(props) {
87
93
  var buttonRef = _react.default.useRef(null);
@@ -135,15 +141,17 @@ var EmojiPickerButton = exports.EmojiPickerButton = function EmojiPickerButton(p
135
141
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
136
142
  ,
137
143
  mountTo: props.setDisableParentScroll ? props.mountPoint : buttonRef.current.parentElement,
138
- fitHeight: 350,
139
- fitWidth: 350,
144
+ fitHeight: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_12') ? EMOJI_PICKER_MAX_HEIGHT : 350,
145
+ fitWidth: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_12') ? EMOJI_PICKER_MAX_WIDTH : 350,
140
146
  offset: [0, 10]
141
147
  // Confluence inline comment editor has z-index: 500
142
148
  // if the toolbar is scrollable, this will be mounted in the root editor
143
149
  // we need an index of > 500 to display over it
144
150
  ,
145
151
  zIndex: props.setDisableParentScroll ? 600 : undefined,
146
- focusTrap: true
152
+ focusTrap: true,
153
+ preventOverflow: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_12'),
154
+ boundariesElement: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_12') ? props.popupsBoundariesElement : undefined
147
155
  }, (0, _react2.jsx)(EmojiPickerWithListener, {
148
156
  handleEscapeKeydown: handleEmojiPressEscape,
149
157
  handleClickOutside: handleEmojiClickOutside,
package/dist/cjs/ui/Toolbar.js CHANGED
@@ -315,6 +315,7 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
315
315
  return dispatchCommand(item.onChange(selected));
316
316
  },
317
317
  mountPoint: emojiAndColourPickerMountPoint,
318
+ popupsBoundariesElement: popupsBoundariesElement,
318
319
  setDisableParentScroll: scrollable ? setDisableScroll : undefined,
319
320
  pluginInjectionApi: api
320
321
  });
package/dist/es2019/pm-plugins/commands.js CHANGED
@@ -2,7 +2,6 @@ import { browser } from '@atlaskit/editor-common/browser';
2
2
  import { copyHTMLToClipboard, copyHTMLToClipboardPolyfill, getNodeCopiedAnalyticsPayload } from '@atlaskit/editor-common/clipboard';
3
3
  import { getSelectedNodeOrNodeParentByNodeType, toDOM } from '@atlaskit/editor-common/copy-button';
4
4
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
5
- import { fg } from '@atlaskit/platform-feature-flags';
6
5
  export const copyNode = (nodeType, editorAnalyticsApi, inputMethod) => ({
7
6
  tr
8
7
  }) => {
@@ -48,7 +47,7 @@ export const copyNode = (nodeType, editorAnalyticsApi, inputMethod) => ({
48
47
  copyHTMLToClipboard(div);
49
48
  }
50
49
  }
51
- if (editorAnalyticsApi && fg('platform_editor_controls_patch_analytics_2')) {
50
+ if (editorAnalyticsApi) {
52
51
  const analyticsPayload = getNodeCopiedAnalyticsPayload(contentNodeWithPos.node, inputMethod);
53
52
  editorAnalyticsApi.attachAnalyticsEvent(analyticsPayload)(copyToClipboardTr);
54
53
  }
package/dist/es2019/ui/EmojiPickerButton.js CHANGED
@@ -73,6 +73,12 @@ const EmojiPickerWithProvider = props => {
73
73
  onPickerRef: setOutsideClickTargetRef
74
74
  });
75
75
  };
76
+
77
+ // Note: These are based on the height and width of the emoji picker at the time
78
+ // of writing (2025-05-05). It is 100% prone to change but at least it's vaguely
79
+ // written down.
80
+ const EMOJI_PICKER_MAX_HEIGHT = 431;
81
+ const EMOJI_PICKER_MAX_WIDTH = 352;
76
82
  const EmojiPickerWithListener = withReactEditorViewOuterListeners(EmojiPickerWithProvider);
77
83
  export const EmojiPickerButton = props => {
78
84
  const buttonRef = React.useRef(null);
@@ -121,15 +127,17 @@ export const EmojiPickerButton = props => {
121
127
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
122
128
  ,
123
129
  mountTo: props.setDisableParentScroll ? props.mountPoint : buttonRef.current.parentElement,
124
- fitHeight: 350,
125
- fitWidth: 350,
130
+ fitHeight: fg('platform_editor_controls_patch_12') ? EMOJI_PICKER_MAX_HEIGHT : 350,
131
+ fitWidth: fg('platform_editor_controls_patch_12') ? EMOJI_PICKER_MAX_WIDTH : 350,
126
132
  offset: [0, 10]
127
133
  // Confluence inline comment editor has z-index: 500
128
134
  // if the toolbar is scrollable, this will be mounted in the root editor
129
135
  // we need an index of > 500 to display over it
130
136
  ,
131
137
  zIndex: props.setDisableParentScroll ? 600 : undefined,
132
- focusTrap: true
138
+ focusTrap: true,
139
+ preventOverflow: fg('platform_editor_controls_patch_12'),
140
+ boundariesElement: fg('platform_editor_controls_patch_12') ? props.popupsBoundariesElement : undefined
133
141
  }, jsx(EmojiPickerWithListener, {
134
142
  handleEscapeKeydown: handleEmojiPressEscape,
135
143
  handleClickOutside: handleEmojiClickOutside,
package/dist/es2019/ui/Toolbar.js CHANGED
@@ -289,6 +289,7 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
289
289
  isSelected: item.selected,
290
290
  onChange: selected => dispatchCommand(item.onChange(selected)),
291
291
  mountPoint: emojiAndColourPickerMountPoint,
292
+ popupsBoundariesElement: popupsBoundariesElement,
292
293
  setDisableParentScroll: scrollable ? setDisableScroll : undefined,
293
294
  pluginInjectionApi: api
294
295
  });
package/dist/esm/pm-plugins/commands.js CHANGED
@@ -2,7 +2,6 @@ import { browser } from '@atlaskit/editor-common/browser';
2
2
  import { copyHTMLToClipboard, copyHTMLToClipboardPolyfill, getNodeCopiedAnalyticsPayload } from '@atlaskit/editor-common/clipboard';
3
3
  import { getSelectedNodeOrNodeParentByNodeType, toDOM } from '@atlaskit/editor-common/copy-button';
4
4
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
5
- import { fg } from '@atlaskit/platform-feature-flags';
6
5
  export var copyNode = function copyNode(nodeType, editorAnalyticsApi, inputMethod) {
7
6
  return function (_ref) {
8
7
  var tr = _ref.tr;
@@ -48,7 +47,7 @@ export var copyNode = function copyNode(nodeType, editorAnalyticsApi, inputMetho
48
47
  copyHTMLToClipboard(div);
49
48
  }
50
49
  }
51
- if (editorAnalyticsApi && fg('platform_editor_controls_patch_analytics_2')) {
50
+ if (editorAnalyticsApi) {
52
51
  var analyticsPayload = getNodeCopiedAnalyticsPayload(contentNodeWithPos.node, inputMethod);
53
52
  editorAnalyticsApi.attachAnalyticsEvent(analyticsPayload)(copyToClipboardTr);
54
53
  }
package/dist/esm/ui/EmojiPickerButton.js CHANGED
@@ -73,6 +73,12 @@ var EmojiPickerWithProvider = function EmojiPickerWithProvider(props) {
73
73
  onPickerRef: setOutsideClickTargetRef
74
74
  });
75
75
  };
76
+
77
+ // Note: These are based on the height and width of the emoji picker at the time
78
+ // of writing (2025-05-05). It is 100% prone to change but at least it's vaguely
79
+ // written down.
80
+ var EMOJI_PICKER_MAX_HEIGHT = 431;
81
+ var EMOJI_PICKER_MAX_WIDTH = 352;
76
82
  var EmojiPickerWithListener = withReactEditorViewOuterListeners(EmojiPickerWithProvider);
77
83
  export var EmojiPickerButton = function EmojiPickerButton(props) {
78
84
  var buttonRef = React.useRef(null);
@@ -126,15 +132,17 @@ export var EmojiPickerButton = function EmojiPickerButton(props) {
126
132
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
127
133
  ,
128
134
  mountTo: props.setDisableParentScroll ? props.mountPoint : buttonRef.current.parentElement,
129
- fitHeight: 350,
130
- fitWidth: 350,
135
+ fitHeight: fg('platform_editor_controls_patch_12') ? EMOJI_PICKER_MAX_HEIGHT : 350,
136
+ fitWidth: fg('platform_editor_controls_patch_12') ? EMOJI_PICKER_MAX_WIDTH : 350,
131
137
  offset: [0, 10]
132
138
  // Confluence inline comment editor has z-index: 500
133
139
  // if the toolbar is scrollable, this will be mounted in the root editor
134
140
  // we need an index of > 500 to display over it
135
141
  ,
136
142
  zIndex: props.setDisableParentScroll ? 600 : undefined,
137
- focusTrap: true
143
+ focusTrap: true,
144
+ preventOverflow: fg('platform_editor_controls_patch_12'),
145
+ boundariesElement: fg('platform_editor_controls_patch_12') ? props.popupsBoundariesElement : undefined
138
146
  }, jsx(EmojiPickerWithListener, {
139
147
  handleEscapeKeydown: handleEmojiPressEscape,
140
148
  handleClickOutside: handleEmojiClickOutside,
package/dist/esm/ui/Toolbar.js CHANGED
@@ -309,6 +309,7 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
309
309
  return dispatchCommand(item.onChange(selected));
310
310
  },
311
311
  mountPoint: emojiAndColourPickerMountPoint,
312
+ popupsBoundariesElement: popupsBoundariesElement,
312
313
  setDisableParentScroll: scrollable ? setDisableScroll : undefined,
313
314
  pluginInjectionApi: api
314
315
  });
package/dist/types/ui/EmojiPickerButton.d.ts CHANGED
@@ -13,6 +13,7 @@ type EmojiPickerButtonReturnType = (props: {
13
13
  onChange?: (emoji: EmojiId) => void;
14
14
  isSelected?: boolean;
15
15
  mountPoint?: HTMLElement;
16
+ popupsBoundariesElement?: HTMLElement;
16
17
  setDisableParentScroll?: (disable: boolean) => void;
17
18
  pluginInjectionApi?: ExtractInjectionAPI<FloatingToolbarPlugin>;
18
19
  }) => JSX.Element;
package/dist/types-ts4.5/ui/EmojiPickerButton.d.ts CHANGED
@@ -13,6 +13,7 @@ type EmojiPickerButtonReturnType = (props: {
13
13
  onChange?: (emoji: EmojiId) => void;
14
14
  isSelected?: boolean;
15
15
  mountPoint?: HTMLElement;
16
+ popupsBoundariesElement?: HTMLElement;
16
17
  setDisableParentScroll?: (disable: boolean) => void;
17
18
  pluginInjectionApi?: ExtractInjectionAPI<FloatingToolbarPlugin>;
18
19
  }) => JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-floating-toolbar",
3
- "version": "4.1.16",
3
+ "version": "4.1.18",
4
4
  "description": "Floating toolbar plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -28,7 +28,7 @@
28
28
  "@atlaskit/adf-utils": "^19.20.0",
29
29
  "@atlaskit/button": "^23.2.0",
30
30
  "@atlaskit/checkbox": "^17.1.0",
31
- "@atlaskit/editor-common": "^106.1.0",
31
+ "@atlaskit/editor-common": "^106.3.0",
32
32
  "@atlaskit/editor-palette": "^2.1.0",
33
33
  "@atlaskit/editor-plugin-analytics": "^2.3.0",
34
34
  "@atlaskit/editor-plugin-context-panel": "^4.1.0",
@@ -42,7 +42,7 @@
42
42
  "@atlaskit/editor-plugin-table": "^10.11.0",
43
43
  "@atlaskit/editor-plugin-user-intent": "^0.1.0",
44
44
  "@atlaskit/editor-prosemirror": "7.0.0",
45
- "@atlaskit/emoji": "^69.2.0",
45
+ "@atlaskit/emoji": "^69.3.0",
46
46
  "@atlaskit/icon": "^26.4.0",
47
47
  "@atlaskit/menu": "^8.0.0",
48
48
  "@atlaskit/modal-dialog": "^14.2.0",
@@ -50,9 +50,9 @@
50
50
  "@atlaskit/primitives": "^14.8.0",
51
51
  "@atlaskit/select": "^20.6.0",
52
52
  "@atlaskit/theme": "^18.0.0",
53
- "@atlaskit/tmp-editor-statsig": "^5.8.0",
54
- "@atlaskit/tokens": "^5.0.0",
55
- "@atlaskit/tooltip": "^20.2.0",
53
+ "@atlaskit/tmp-editor-statsig": "^5.14.0",
54
+ "@atlaskit/tokens": "^5.1.0",
55
+ "@atlaskit/tooltip": "^20.3.0",
56
56
  "@babel/runtime": "^7.0.0",
57
57
  "@emotion/react": "^11.7.1",
58
58
  "bind-event-listener": "^3.0.0",
@@ -143,14 +143,14 @@
143
143
  "platform_editor_controls_patch_6": {
144
144
  "type": "boolean"
145
145
  },
146
- "platform_editor_controls_patch_analytics_2": {
147
- "type": "boolean"
148
- },
149
146
  "platform_editor_controls_patch_8": {
150
147
  "type": "boolean"
151
148
  },
152
149
  "platform_editor_interaction_api_refactor": {
153
150
  "type": "boolean"
151
+ },
152
+ "platform_editor_controls_patch_12": {
153
+ "type": "boolean"
154
154
  }
155
155
  }
156
156
  }