@atlaskit/editor-plugin-floating-toolbar 4.0.3 → 4.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/editor-plugin-floating-toolbar
2
2
 
3
+ ## 4.0.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [#145321](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/145321)
8
+ [`2798c91b69bd9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2798c91b69bd9) -
9
+ [ux] ED-27537 Update dropdown to take in shouldFitContainer prop to fix dropdown content not
10
+ fitting for layout dropdown and add vr tests
11
+ - Updated dependencies
12
+
13
+ ## 4.0.4
14
+
15
+ ### Patch Changes
16
+
17
+ - [#145307](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/145307)
18
+ [`64c485e3d2d32`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/64c485e3d2d32) -
19
+ [ux] Group AI buttons in Editor floating toolbar
20
+ - Updated dependencies
21
+
3
22
  ## 4.0.3
4
23
 
5
24
  ### Patch Changes
@@ -155,7 +155,8 @@ var Dropdown = exports.default = /*#__PURE__*/function (_Component) {
155
155
  footer = _this$props2.footer,
156
156
  onMount = _this$props2.onMount,
157
157
  pulse = _this$props2.pulse,
158
- spotlightConfig = _this$props2.spotlightConfig;
158
+ spotlightConfig = _this$props2.spotlightConfig,
159
+ shouldFitContainer = _this$props2.shouldFitContainer;
159
160
  var trigger;
160
161
  if (icon) {
161
162
  var TriggerIcon = hideExpandIcon ? icon : (0, _react2.jsx)(CompositeIcon, {
@@ -228,7 +229,8 @@ var Dropdown = exports.default = /*#__PURE__*/function (_Component) {
228
229
  alignDropdownWithParentElement: alignDropdownWithToolbar,
229
230
  arrowKeyNavigationProviderOptions: {
230
231
  type: _uiMenu.ArrowKeyNavigationType.MENU
231
- }
232
+ },
233
+ shouldFitContainer: shouldFitContainer
232
234
  }, Array.isArray(options) ? this.renderArrayOptions(options) : typeof options === 'function' ? this.renderArrayOptions(this.makeArrayOptionsFromCallback(options)) : options.render({
233
235
  hide: this.hide,
234
236
  dispatchCommand: dispatchCommand
@@ -63,6 +63,12 @@ function groupItems(items) {
63
63
  } else {
64
64
  finalOutput.push(item);
65
65
  }
66
+ } else if (item.type === 'separator' && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6')) {
67
+ var _items;
68
+ var isLeadingSeparator = i === 0;
69
+ var isTrailingSeparator = i === items.length - 1;
70
+ var isDuplicateSeparator = ((_items = items[i - 1]) === null || _items === void 0 ? void 0 : _items.type) === 'separator';
71
+ !isLeadingSeparator && !isTrailingSeparator && !isDuplicateSeparator && finalOutput.push(item);
66
72
  } else {
67
73
  finalOutput.push(item);
68
74
  }
@@ -243,7 +249,8 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
243
249
  footer: item.footer,
244
250
  onMount: item.onMount,
245
251
  onClick: item.onClick,
246
- pulse: item.pulse
252
+ pulse: item.pulse,
253
+ shouldFitContainer: item.shouldFitContainer
247
254
  });
248
255
  case 'select':
249
256
  if (item.selectType === 'list') {
@@ -334,6 +341,12 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
334
341
  scrollable: scrollable
335
342
  });
336
343
  case 'separator':
344
+ if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6')) {
345
+ return item.fullHeight ? (0, _react2.jsx)(_ui.FloatingToolbarSeparator, {
346
+ key: idx,
347
+ fullHeight: true
348
+ }) : null;
349
+ }
337
350
  return (0, _react2.jsx)(_ui.FloatingToolbarSeparator, {
338
351
  key: idx,
339
352
  fullHeight: item.fullHeight
@@ -135,7 +135,8 @@ export default class Dropdown extends Component {
135
135
  footer,
136
136
  onMount,
137
137
  pulse,
138
- spotlightConfig
138
+ spotlightConfig,
139
+ shouldFitContainer
139
140
  } = this.props;
140
141
  let trigger;
141
142
  if (icon) {
@@ -209,7 +210,8 @@ export default class Dropdown extends Component {
209
210
  alignDropdownWithParentElement: alignDropdownWithToolbar,
210
211
  arrowKeyNavigationProviderOptions: {
211
212
  type: ArrowKeyNavigationType.MENU
212
- }
213
+ },
214
+ shouldFitContainer: shouldFitContainer
213
215
  }, Array.isArray(options) ? this.renderArrayOptions(options) : typeof options === 'function' ? this.renderArrayOptions(this.makeArrayOptionsFromCallback(options)) : options.render({
214
216
  hide: this.hide,
215
217
  dispatchCommand
@@ -51,6 +51,12 @@ export function groupItems(items) {
51
51
  } else {
52
52
  finalOutput.push(item);
53
53
  }
54
+ } else if (item.type === 'separator' && editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
55
+ var _items;
56
+ const isLeadingSeparator = i === 0;
57
+ const isTrailingSeparator = i === items.length - 1;
58
+ const isDuplicateSeparator = ((_items = items[i - 1]) === null || _items === void 0 ? void 0 : _items.type) === 'separator';
59
+ !isLeadingSeparator && !isTrailingSeparator && !isDuplicateSeparator && finalOutput.push(item);
54
60
  } else {
55
61
  finalOutput.push(item);
56
62
  }
@@ -220,7 +226,8 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
220
226
  footer: item.footer,
221
227
  onMount: item.onMount,
222
228
  onClick: item.onClick,
223
- pulse: item.pulse
229
+ pulse: item.pulse,
230
+ shouldFitContainer: item.shouldFitContainer
224
231
  });
225
232
  case 'select':
226
233
  if (item.selectType === 'list') {
@@ -307,6 +314,12 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
307
314
  scrollable: scrollable
308
315
  });
309
316
  case 'separator':
317
+ if (editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
318
+ return item.fullHeight ? jsx(Separator, {
319
+ key: idx,
320
+ fullHeight: true
321
+ }) : null;
322
+ }
310
323
  return jsx(Separator, {
311
324
  key: idx,
312
325
  fullHeight: item.fullHeight
@@ -150,7 +150,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
150
150
  footer = _this$props2.footer,
151
151
  onMount = _this$props2.onMount,
152
152
  pulse = _this$props2.pulse,
153
- spotlightConfig = _this$props2.spotlightConfig;
153
+ spotlightConfig = _this$props2.spotlightConfig,
154
+ shouldFitContainer = _this$props2.shouldFitContainer;
154
155
  var trigger;
155
156
  if (icon) {
156
157
  var TriggerIcon = hideExpandIcon ? icon : jsx(CompositeIcon, {
@@ -223,7 +224,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
223
224
  alignDropdownWithParentElement: alignDropdownWithToolbar,
224
225
  arrowKeyNavigationProviderOptions: {
225
226
  type: ArrowKeyNavigationType.MENU
226
- }
227
+ },
228
+ shouldFitContainer: shouldFitContainer
227
229
  }, Array.isArray(options) ? this.renderArrayOptions(options) : typeof options === 'function' ? this.renderArrayOptions(this.makeArrayOptionsFromCallback(options)) : options.render({
228
230
  hide: this.hide,
229
231
  dispatchCommand: dispatchCommand
@@ -56,6 +56,12 @@ export function groupItems(items) {
56
56
  } else {
57
57
  finalOutput.push(item);
58
58
  }
59
+ } else if (item.type === 'separator' && editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
60
+ var _items;
61
+ var isLeadingSeparator = i === 0;
62
+ var isTrailingSeparator = i === items.length - 1;
63
+ var isDuplicateSeparator = ((_items = items[i - 1]) === null || _items === void 0 ? void 0 : _items.type) === 'separator';
64
+ !isLeadingSeparator && !isTrailingSeparator && !isDuplicateSeparator && finalOutput.push(item);
59
65
  } else {
60
66
  finalOutput.push(item);
61
67
  }
@@ -236,7 +242,8 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
236
242
  footer: item.footer,
237
243
  onMount: item.onMount,
238
244
  onClick: item.onClick,
239
- pulse: item.pulse
245
+ pulse: item.pulse,
246
+ shouldFitContainer: item.shouldFitContainer
240
247
  });
241
248
  case 'select':
242
249
  if (item.selectType === 'list') {
@@ -327,6 +334,12 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
327
334
  scrollable: scrollable
328
335
  });
329
336
  case 'separator':
337
+ if (editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
338
+ return item.fullHeight ? jsx(Separator, {
339
+ key: idx,
340
+ fullHeight: true
341
+ }) : null;
342
+ }
330
343
  return jsx(Separator, {
331
344
  key: idx,
332
345
  fullHeight: item.fullHeight
@@ -35,6 +35,7 @@ export interface Props {
35
35
  /** If true, the component will have pulse onboarding effect around it. */
36
36
  pulse?: boolean;
37
37
  spotlightConfig?: FloatingToolbarButtonSpotlightConfig;
38
+ shouldFitContainer?: boolean;
38
39
  }
39
40
  export interface State {
40
41
  isOpen: boolean;
@@ -30,6 +30,7 @@ export interface Props {
30
30
  scrollable?: boolean;
31
31
  api: ExtractInjectionAPI<FloatingToolbarPlugin> | undefined;
32
32
  mediaAssistiveMessage?: string;
33
+ shouldFitContainer?: boolean;
33
34
  }
34
35
  type GroupedItems = (Item | Item[])[];
35
36
  export declare function groupItems(items: Item[]): GroupedItems;
@@ -35,6 +35,7 @@ export interface Props {
35
35
  /** If true, the component will have pulse onboarding effect around it. */
36
36
  pulse?: boolean;
37
37
  spotlightConfig?: FloatingToolbarButtonSpotlightConfig;
38
+ shouldFitContainer?: boolean;
38
39
  }
39
40
  export interface State {
40
41
  isOpen: boolean;
@@ -30,6 +30,7 @@ export interface Props {
30
30
  scrollable?: boolean;
31
31
  api: ExtractInjectionAPI<FloatingToolbarPlugin> | undefined;
32
32
  mediaAssistiveMessage?: string;
33
+ shouldFitContainer?: boolean;
33
34
  }
34
35
  type GroupedItems = (Item | Item[])[];
35
36
  export declare function groupItems(items: Item[]): GroupedItems;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-floating-toolbar",
3
- "version": "4.0.3",
3
+ "version": "4.0.5",
4
4
  "description": "Floating toolbar plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -27,8 +27,8 @@
27
27
  "dependencies": {
28
28
  "@atlaskit/adf-utils": "^19.19.0",
29
29
  "@atlaskit/button": "^23.0.0",
30
- "@atlaskit/checkbox": "^17.0.0",
31
- "@atlaskit/editor-common": "^103.12.0",
30
+ "@atlaskit/checkbox": "^17.1.0",
31
+ "@atlaskit/editor-common": "^103.15.0",
32
32
  "@atlaskit/editor-palette": "^2.1.0",
33
33
  "@atlaskit/editor-plugin-context-panel": "^4.0.0",
34
34
  "@atlaskit/editor-plugin-copy-button": "^2.0.0",
@@ -38,18 +38,18 @@
38
38
  "@atlaskit/editor-plugin-emoji": "^3.6.0",
39
39
  "@atlaskit/editor-plugin-extension": "^5.2.0",
40
40
  "@atlaskit/editor-plugin-interaction": "^1.0.0",
41
- "@atlaskit/editor-plugin-table": "^10.8.0",
41
+ "@atlaskit/editor-plugin-table": "^10.9.0",
42
42
  "@atlaskit/editor-plugin-user-intent": "^0.1.0",
43
43
  "@atlaskit/editor-prosemirror": "7.0.0",
44
- "@atlaskit/emoji": "^69.0.0",
44
+ "@atlaskit/emoji": "^69.1.0",
45
45
  "@atlaskit/icon": "^25.6.0",
46
46
  "@atlaskit/menu": "^3.2.0",
47
47
  "@atlaskit/modal-dialog": "^14.1.0",
48
48
  "@atlaskit/platform-feature-flags": "^1.1.0",
49
49
  "@atlaskit/primitives": "^14.4.0",
50
- "@atlaskit/select": "^20.3.0",
50
+ "@atlaskit/select": "^20.4.0",
51
51
  "@atlaskit/theme": "^18.0.0",
52
- "@atlaskit/tmp-editor-statsig": "^4.12.0",
52
+ "@atlaskit/tmp-editor-statsig": "^4.13.0",
53
53
  "@atlaskit/tokens": "^4.8.0",
54
54
  "@atlaskit/tooltip": "^20.0.0",
55
55
  "@babel/runtime": "^7.0.0",
@@ -141,6 +141,9 @@
141
141
  },
142
142
  "platform_editor_user_intent_plugin": {
143
143
  "type": "boolean"
144
+ },
145
+ "platform_editor_controls_patch_6": {
146
+ "type": "boolean"
144
147
  }
145
148
  }
146
149
  }