@atlaskit/editor-plugin-toolbar 3.4.5 → 3.4.7

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-plugin-toolbar
 
+## 3.4.7
+
+### Patch Changes
+
+- [`8263f21e34dff`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8263f21e34dff) -
+  [ux] ED-29646 Implement ResponsiveContainer breakpoint preset system
+- Updated dependencies
+
+## 3.4.6
+
+### Patch Changes
+
+- [`373dccb169d0b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/373dccb169d0b) -
+  ED-29654 Editor experience custom tracking
+- Updated dependencies
+
 ## 3.4.5
 
 ### Patch Changes

package/dist/cjs/pm-plugins/experiences/selection-toolbar-open-experience.js

@@ -28,7 +28,8 @@ var ABORT_REASON = {
  * Abort: When selection transition to empty or block menu is opened
  */
 var getSelectionToolbarOpenExperiencePlugin = exports.getSelectionToolbarOpenExperiencePlugin = function getSelectionToolbarOpenExperiencePlugin(_ref) {
-  var refs = _ref.refs;
+  var refs = _ref.refs,
+    dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent;
   var targetEl;
   var editorViewEl;
   var getTarget = function getTarget() {
@@ -38,6 +39,7 @@ var getSelectionToolbarOpenExperiencePlugin = exports.getSelectionToolbarOpenExp
     return targetEl;
   };
   var experience = new _experiences.Experience('selection-toolbar-open', {
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
     checks: [new _experiences.ExperienceCheckTimeout({
       durationMs: 500,
       onTimeout: function onTimeout() {

package/dist/cjs/toolbarPlugin.js

@@ -79,9 +79,10 @@ var toolbarPlugin = exports.toolbarPlugin = function toolbarPlugin(_ref) {
   var disableSelectionToolbar = config.disableSelectionToolbar,
     disableSelectionToolbarWhenPinned = config.disableSelectionToolbarWhenPinned,
     _config$contextualFor = config.contextualFormattingEnabled,
-    contextualFormattingEnabled = _config$contextualFor === void 0 ? 'always-pinned' : _config$contextualFor;
+    contextualFormattingEnabled = _config$contextualFor === void 0 ? 'always-pinned' : _config$contextualFor,
+    breakpointPreset = config.breakpointPreset;
   var registry = (0, _editorToolbarModel.createComponentRegistry)();
-  registry.register((0, _toolbarComponents.getToolbarComponents)(contextualFormattingEnabled, api, disableSelectionToolbar));
+  registry.register((0, _toolbarComponents.getToolbarComponents)(contextualFormattingEnabled, api, disableSelectionToolbar, breakpointPreset));
   return {
     name: 'toolbar',
     actions: {
@@ -189,7 +190,11 @@ var toolbarPlugin = exports.toolbarPlugin = function toolbarPlugin(_ref) {
         name: 'selectionToolbarOpenExperience',
         plugin: function plugin() {
           return (0, _selectionToolbarOpenExperience.getSelectionToolbarOpenExperiencePlugin)({
-            refs: refs
+            refs: refs,
+            dispatchAnalyticsEvent: function dispatchAnalyticsEvent(payload) {
+              var _api$analytics;
+              return api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || (_api$analytics = _api$analytics.actions) === null || _api$analytics === void 0 ? void 0 : _api$analytics.fireAnalyticsEvent(payload);
+            }
           });
         }
       }] : []));

package/dist/cjs/ui/PrimaryToolbar.js

@@ -8,12 +8,23 @@ exports.PrimaryToolbar = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _toolbar = require("@atlaskit/editor-common/toolbar");
 var _editorToolbar = require("@atlaskit/editor-toolbar");
+var isFullPage = function isFullPage(editorAppearance) {
+  return editorAppearance === 'full-page' || editorAppearance === 'full-width';
+};
+var getBreakpointPreset = function getBreakpointPreset(breakpointPreset, editorAppearance) {
+  if (breakpointPreset) {
+    return breakpointPreset;
+  }
+  return editorAppearance && isFullPage(editorAppearance) ? 'fullpage' : 'reduced';
+};
 var PrimaryToolbar = exports.PrimaryToolbar = function PrimaryToolbar(_ref) {
-  var children = _ref.children;
+  var children = _ref.children,
+    breakpointPreset = _ref.breakpointPreset;
   var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
     editorAppearance = _useEditorToolbar.editorAppearance;
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.PrimaryToolbar, {
     label: "Primary Toolbar",
-    reducedBreakpoints: editorAppearance !== 'full-page'
+    reducedBreakpoints: editorAppearance !== 'full-page',
+    breakpointPreset: getBreakpointPreset(breakpointPreset, editorAppearance)
   }, children);
 };

package/dist/cjs/ui/toolbar-components.js

@@ -32,12 +32,17 @@ var getInlineTextToolbarComponents = function getInlineTextToolbarComponents() {
     }
   }];
 };
-var getPrimaryToolbarComponents = function getPrimaryToolbarComponents() {
+var getPrimaryToolbarComponents = function getPrimaryToolbarComponents(breakpointPreset) {
   return [{
     type: 'toolbar',
     key: _toolbar.TOOLBARS.PRIMARY_TOOLBAR,
-    component: (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) ? _PrimaryToolbar.PrimaryToolbar : function (_ref2) {
+    component: (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) ? function (_ref2) {
       var children = _ref2.children;
+      return /*#__PURE__*/_react.default.createElement(_PrimaryToolbar.PrimaryToolbar, {
+        breakpointPreset: breakpointPreset
+      }, children);
+    } : function (_ref3) {
+      var children = _ref3.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.PrimaryToolbar, {
         label: "Primary Toolbar",
         testId: "primary-toolbar"
@@ -45,7 +50,7 @@ var getPrimaryToolbarComponents = function getPrimaryToolbarComponents() {
     }
   }];
 };
-var getToolbarComponents = exports.getToolbarComponents = function getToolbarComponents(contextualFormattingEnabled, api, disableSelectionToolbar) {
+var getToolbarComponents = exports.getToolbarComponents = function getToolbarComponents(contextualFormattingEnabled, api, disableSelectionToolbar, breakpointPreset) {
   var components = [{
     type: _toolbar.TEXT_SECTION.type,
     key: _toolbar.TEXT_SECTION.key,
@@ -54,9 +59,9 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
       key: _toolbar.TOOLBARS.INLINE_TEXT_TOOLBAR,
       rank: _toolbar.TOOLBAR_RANK[_toolbar.TEXT_SECTION.key]
     }],
-    component: function component(_ref3) {
-      var children = _ref3.children,
-        parents = _ref3.parents;
+    component: function component(_ref4) {
+      var children = _ref4.children,
+        parents = _ref4.parents;
       if ((0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_responsive', 'isEnabled', true)) {
         return /*#__PURE__*/_react.default.createElement(_editorToolbar.Show, {
           above: "md"
@@ -82,9 +87,9 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
       key: _toolbar.TOOLBARS.PRIMARY_TOOLBAR,
       rank: _toolbar.TOOLBAR_RANK[_toolbar.TEXT_SECTION.key]
     }],
-    component: function component(_ref4) {
-      var children = _ref4.children,
-        parents = _ref4.parents;
+    component: function component(_ref5) {
+      var children = _ref5.children,
+        parents = _ref5.parents;
       if ((0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_responsive', 'isEnabled', true)) {
         return /*#__PURE__*/_react.default.createElement(_editorToolbar.Show, {
           above: "md"
@@ -114,9 +119,9 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
       key: _toolbar.TOOLBARS.INLINE_TEXT_TOOLBAR,
       rank: _toolbar.TOOLBAR_RANK[_toolbar.TEXT_SECTION_COLLAPSED.key]
     }],
-    component: function component(_ref5) {
-      var children = _ref5.children,
-        parents = _ref5.parents;
+    component: function component(_ref6) {
+      var children = _ref6.children,
+        parents = _ref6.parents;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.Show, {
         below: "md"
       }, /*#__PURE__*/_react.default.createElement(_Section.Section, {
@@ -151,9 +156,9 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
       key: _toolbar.TOOLBARS.PRIMARY_TOOLBAR,
       rank: _toolbar.TOOLBAR_RANK[_toolbar.INSERT_BLOCK_SECTION.key]
     }],
-    component: function component(_ref6) {
-      var children = _ref6.children,
-        parents = _ref6.parents;
+    component: function component(_ref7) {
+      var children = _ref7.children,
+        parents = _ref7.parents;
       return /*#__PURE__*/_react.default.createElement(_Section.Section, {
         testId: "insert-block-section",
         parents: parents,
@@ -174,9 +179,9 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
       key: _toolbar.TOOLBARS.PRIMARY_TOOLBAR,
       rank: _toolbar.TOOLBAR_RANK[_toolbar.LINKING_SECTION.key]
     }],
-    component: function component(_ref7) {
-      var children = _ref7.children,
-        parents = _ref7.parents;
+    component: function component(_ref8) {
+      var children = _ref8.children,
+        parents = _ref8.parents;
       return /*#__PURE__*/_react.default.createElement(_Section.Section, {
         testId: "link-section",
         parents: parents,
@@ -208,8 +213,8 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
       key: _toolbar.OVERFLOW_GROUP.key,
       rank: _toolbar.OVERFLOW_GROUP_RANK[_toolbar.OVERFLOW_MENU.key]
     }],
-    component: function component(_ref8) {
-      var children = _ref8.children;
+    component: function component(_ref9) {
+      var children = _ref9.children;
       return /*#__PURE__*/_react.default.createElement(_OverflowMenu.OverflowMenu, null, children);
     }
   }, {
@@ -230,8 +235,8 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
         key: _toolbar.TOOLBARS.PRIMARY_TOOLBAR,
         rank: _toolbar.TOOLBAR_RANK[_toolbar.OVERFLOW_SECTION_PRIMARY_TOOLBAR.key]
       }],
-      component: function component(_ref9) {
-        var children = _ref9.children;
+      component: function component(_ref0) {
+        var children = _ref0.children;
         return /*#__PURE__*/_react.default.createElement(_OverflowSection.OverflowSection, null, children);
       }
     }, {
@@ -250,8 +255,8 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
         key: _toolbar.OVERFLOW_GROUP_PRIMARY_TOOLBAR.key,
         rank: _toolbar.OVERFLOW_GROUP_PRIMARY_TOOLBAR_RANK[_toolbar.OVERFLOW_MENU_PRIMARY_TOOLBAR.key]
       }],
-      component: function component(_ref0) {
-        var children = _ref0.children;
+      component: function component(_ref1) {
+        var children = _ref1.children;
         return /*#__PURE__*/_react.default.createElement(_OverflowMenu.OverflowMenu, null, children);
       }
     });
@@ -262,16 +267,16 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
         components.unshift.apply(components, (0, _toConsumableArray2.default)(getInlineTextToolbarComponents()));
         break;
       case 'always-pinned':
-        components.unshift.apply(components, (0, _toConsumableArray2.default)(getPrimaryToolbarComponents()));
+        components.unshift.apply(components, (0, _toConsumableArray2.default)(getPrimaryToolbarComponents(breakpointPreset)));
         break;
       case 'controlled':
         components.unshift.apply(components, (0, _toConsumableArray2.default)(getInlineTextToolbarComponents()));
-        components.unshift.apply(components, (0, _toConsumableArray2.default)(getPrimaryToolbarComponents()));
+        components.unshift.apply(components, (0, _toConsumableArray2.default)(getPrimaryToolbarComponents(breakpointPreset)));
         break;
     }
   } else {
     components.unshift.apply(components, (0, _toConsumableArray2.default)(getInlineTextToolbarComponents()));
-    components.unshift.apply(components, (0, _toConsumableArray2.default)(getPrimaryToolbarComponents()));
+    components.unshift.apply(components, (0, _toConsumableArray2.default)(getPrimaryToolbarComponents(breakpointPreset)));
   }
   return components;
 };

package/dist/es2019/pm-plugins/experiences/selection-toolbar-open-experience.js

@@ -20,7 +20,8 @@ const ABORT_REASON = {
  * Abort: When selection transition to empty or block menu is opened
  */
 export const getSelectionToolbarOpenExperiencePlugin = ({
-  refs
+  refs,
+  dispatchAnalyticsEvent
 }) => {
   let targetEl;
   let editorViewEl;
@@ -31,6 +32,7 @@ export const getSelectionToolbarOpenExperiencePlugin = ({
     return targetEl;
   };
   const experience = new Experience('selection-toolbar-open', {
+    dispatchAnalyticsEvent,
     checks: [new ExperienceCheckTimeout({
       durationMs: 500,
       onTimeout: () => {

package/dist/es2019/toolbarPlugin.js

@@ -64,10 +64,11 @@ export const toolbarPlugin = ({
   const {
     disableSelectionToolbar,
     disableSelectionToolbarWhenPinned,
-    contextualFormattingEnabled = 'always-pinned'
+    contextualFormattingEnabled = 'always-pinned',
+    breakpointPreset
   } = config;
   const registry = createComponentRegistry();
-  registry.register(getToolbarComponents(contextualFormattingEnabled, api, disableSelectionToolbar));
+  registry.register(getToolbarComponents(contextualFormattingEnabled, api, disableSelectionToolbar, breakpointPreset));
   return {
     name: 'toolbar',
     actions: {
@@ -178,7 +179,11 @@ export const toolbarPlugin = ({
       }, ...(!disableSelectionToolbar && expValEquals('platform_editor_experience_tracking', 'isEnabled', true) ? [{
         name: 'selectionToolbarOpenExperience',
         plugin: () => getSelectionToolbarOpenExperiencePlugin({
-          refs
+          refs,
+          dispatchAnalyticsEvent: payload => {
+            var _api$analytics, _api$analytics$action;
+            return api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : (_api$analytics$action = _api$analytics.actions) === null || _api$analytics$action === void 0 ? void 0 : _api$analytics$action.fireAnalyticsEvent(payload);
+          }
         })
       }] : [])];
     },

package/dist/es2019/ui/PrimaryToolbar.js

@@ -1,14 +1,25 @@
 import React from 'react';
 import { useEditorToolbar } from '@atlaskit/editor-common/toolbar';
 import { PrimaryToolbar as PrimaryToolbarBase } from '@atlaskit/editor-toolbar';
+const isFullPage = editorAppearance => {
+  return editorAppearance === 'full-page' || editorAppearance === 'full-width';
+};
+const getBreakpointPreset = (breakpointPreset, editorAppearance) => {
+  if (breakpointPreset) {
+    return breakpointPreset;
+  }
+  return editorAppearance && isFullPage(editorAppearance) ? 'fullpage' : 'reduced';
+};
 export const PrimaryToolbar = ({
-  children
+  children,
+  breakpointPreset
 }) => {
   const {
     editorAppearance
   } = useEditorToolbar();
   return /*#__PURE__*/React.createElement(PrimaryToolbarBase, {
     label: "Primary Toolbar",
-    reducedBreakpoints: editorAppearance !== 'full-page'
+    reducedBreakpoints: editorAppearance !== 'full-page',
+    breakpointPreset: getBreakpointPreset(breakpointPreset, editorAppearance)
   }, children);
 };

package/dist/es2019/ui/toolbar-components.js

@@ -25,11 +25,15 @@ const getInlineTextToolbarComponents = () => {
     }
   }];
 };
-const getPrimaryToolbarComponents = () => {
+const getPrimaryToolbarComponents = breakpointPreset => {
   return [{
     type: 'toolbar',
     key: TOOLBARS.PRIMARY_TOOLBAR,
-    component: expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) ? PrimaryToolbar : ({
+    component: expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) ? ({
+      children
+    }) => /*#__PURE__*/React.createElement(PrimaryToolbar, {
+      breakpointPreset: breakpointPreset
+    }, children) : ({
       children
     }) => /*#__PURE__*/React.createElement(PrimaryToolbarBase, {
       label: "Primary Toolbar",
@@ -37,7 +41,7 @@ const getPrimaryToolbarComponents = () => {
     }, children)
   }];
 };
-export const getToolbarComponents = (contextualFormattingEnabled, api, disableSelectionToolbar) => {
+export const getToolbarComponents = (contextualFormattingEnabled, api, disableSelectionToolbar, breakpointPreset) => {
   const components = [{
     type: TEXT_SECTION.type,
     key: TEXT_SECTION.key,
@@ -258,16 +262,16 @@ export const getToolbarComponents = (contextualFormattingEnabled, api, disableSe
         components.unshift(...getInlineTextToolbarComponents());
         break;
       case 'always-pinned':
-        components.unshift(...getPrimaryToolbarComponents());
+        components.unshift(...getPrimaryToolbarComponents(breakpointPreset));
         break;
       case 'controlled':
         components.unshift(...getInlineTextToolbarComponents());
-        components.unshift(...getPrimaryToolbarComponents());
+        components.unshift(...getPrimaryToolbarComponents(breakpointPreset));
         break;
     }
   } else {
     components.unshift(...getInlineTextToolbarComponents());
-    components.unshift(...getPrimaryToolbarComponents());
+    components.unshift(...getPrimaryToolbarComponents(breakpointPreset));
   }
   return components;
 };

package/dist/esm/pm-plugins/experiences/selection-toolbar-open-experience.js

@@ -21,7 +21,8 @@ var ABORT_REASON = {
  * Abort: When selection transition to empty or block menu is opened
  */
 export var getSelectionToolbarOpenExperiencePlugin = function getSelectionToolbarOpenExperiencePlugin(_ref) {
-  var refs = _ref.refs;
+  var refs = _ref.refs,
+    dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent;
   var targetEl;
   var editorViewEl;
   var getTarget = function getTarget() {
@@ -31,6 +32,7 @@ export var getSelectionToolbarOpenExperiencePlugin = function getSelectionToolba
     return targetEl;
   };
   var experience = new Experience('selection-toolbar-open', {
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
     checks: [new ExperienceCheckTimeout({
       durationMs: 500,
       onTimeout: function onTimeout() {

package/dist/esm/toolbarPlugin.js

@@ -72,9 +72,10 @@ export var toolbarPlugin = function toolbarPlugin(_ref) {
   var disableSelectionToolbar = config.disableSelectionToolbar,
     disableSelectionToolbarWhenPinned = config.disableSelectionToolbarWhenPinned,
     _config$contextualFor = config.contextualFormattingEnabled,
-    contextualFormattingEnabled = _config$contextualFor === void 0 ? 'always-pinned' : _config$contextualFor;
+    contextualFormattingEnabled = _config$contextualFor === void 0 ? 'always-pinned' : _config$contextualFor,
+    breakpointPreset = config.breakpointPreset;
   var registry = createComponentRegistry();
-  registry.register(getToolbarComponents(contextualFormattingEnabled, api, disableSelectionToolbar));
+  registry.register(getToolbarComponents(contextualFormattingEnabled, api, disableSelectionToolbar, breakpointPreset));
   return {
     name: 'toolbar',
     actions: {
@@ -182,7 +183,11 @@ export var toolbarPlugin = function toolbarPlugin(_ref) {
         name: 'selectionToolbarOpenExperience',
         plugin: function plugin() {
           return getSelectionToolbarOpenExperiencePlugin({
-            refs: refs
+            refs: refs,
+            dispatchAnalyticsEvent: function dispatchAnalyticsEvent(payload) {
+              var _api$analytics;
+              return api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || (_api$analytics = _api$analytics.actions) === null || _api$analytics === void 0 ? void 0 : _api$analytics.fireAnalyticsEvent(payload);
+            }
           });
         }
       }] : []));

package/dist/esm/ui/PrimaryToolbar.js

@@ -1,12 +1,23 @@
 import React from 'react';
 import { useEditorToolbar } from '@atlaskit/editor-common/toolbar';
 import { PrimaryToolbar as PrimaryToolbarBase } from '@atlaskit/editor-toolbar';
+var isFullPage = function isFullPage(editorAppearance) {
+  return editorAppearance === 'full-page' || editorAppearance === 'full-width';
+};
+var getBreakpointPreset = function getBreakpointPreset(breakpointPreset, editorAppearance) {
+  if (breakpointPreset) {
+    return breakpointPreset;
+  }
+  return editorAppearance && isFullPage(editorAppearance) ? 'fullpage' : 'reduced';
+};
 export var PrimaryToolbar = function PrimaryToolbar(_ref) {
-  var children = _ref.children;
+  var children = _ref.children,
+    breakpointPreset = _ref.breakpointPreset;
   var _useEditorToolbar = useEditorToolbar(),
     editorAppearance = _useEditorToolbar.editorAppearance;
   return /*#__PURE__*/React.createElement(PrimaryToolbarBase, {
     label: "Primary Toolbar",
-    reducedBreakpoints: editorAppearance !== 'full-page'
+    reducedBreakpoints: editorAppearance !== 'full-page',
+    breakpointPreset: getBreakpointPreset(breakpointPreset, editorAppearance)
   }, children);
 };

package/dist/esm/ui/toolbar-components.js

@@ -25,12 +25,17 @@ var getInlineTextToolbarComponents = function getInlineTextToolbarComponents() {
     }
   }];
 };
-var getPrimaryToolbarComponents = function getPrimaryToolbarComponents() {
+var getPrimaryToolbarComponents = function getPrimaryToolbarComponents(breakpointPreset) {
   return [{
     type: 'toolbar',
     key: TOOLBARS.PRIMARY_TOOLBAR,
-    component: expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) ? PrimaryToolbar : function (_ref2) {
+    component: expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) ? function (_ref2) {
       var children = _ref2.children;
+      return /*#__PURE__*/React.createElement(PrimaryToolbar, {
+        breakpointPreset: breakpointPreset
+      }, children);
+    } : function (_ref3) {
+      var children = _ref3.children;
       return /*#__PURE__*/React.createElement(PrimaryToolbarBase, {
         label: "Primary Toolbar",
         testId: "primary-toolbar"
@@ -38,7 +43,7 @@ var getPrimaryToolbarComponents = function getPrimaryToolbarComponents() {
     }
   }];
 };
-export var getToolbarComponents = function getToolbarComponents(contextualFormattingEnabled, api, disableSelectionToolbar) {
+export var getToolbarComponents = function getToolbarComponents(contextualFormattingEnabled, api, disableSelectionToolbar, breakpointPreset) {
   var components = [{
     type: TEXT_SECTION.type,
     key: TEXT_SECTION.key,
@@ -47,9 +52,9 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
       key: TOOLBARS.INLINE_TEXT_TOOLBAR,
       rank: TOOLBAR_RANK[TEXT_SECTION.key]
     }],
-    component: function component(_ref3) {
-      var children = _ref3.children,
-        parents = _ref3.parents;
+    component: function component(_ref4) {
+      var children = _ref4.children,
+        parents = _ref4.parents;
       if (expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true)) {
         return /*#__PURE__*/React.createElement(Show, {
           above: "md"
@@ -75,9 +80,9 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
       key: TOOLBARS.PRIMARY_TOOLBAR,
       rank: TOOLBAR_RANK[TEXT_SECTION.key]
     }],
-    component: function component(_ref4) {
-      var children = _ref4.children,
-        parents = _ref4.parents;
+    component: function component(_ref5) {
+      var children = _ref5.children,
+        parents = _ref5.parents;
       if (expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true)) {
         return /*#__PURE__*/React.createElement(Show, {
           above: "md"
@@ -107,9 +112,9 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
       key: TOOLBARS.INLINE_TEXT_TOOLBAR,
       rank: TOOLBAR_RANK[TEXT_SECTION_COLLAPSED.key]
     }],
-    component: function component(_ref5) {
-      var children = _ref5.children,
-        parents = _ref5.parents;
+    component: function component(_ref6) {
+      var children = _ref6.children,
+        parents = _ref6.parents;
       return /*#__PURE__*/React.createElement(Show, {
         below: "md"
       }, /*#__PURE__*/React.createElement(Section, {
@@ -144,9 +149,9 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
       key: TOOLBARS.PRIMARY_TOOLBAR,
       rank: TOOLBAR_RANK[INSERT_BLOCK_SECTION.key]
     }],
-    component: function component(_ref6) {
-      var children = _ref6.children,
-        parents = _ref6.parents;
+    component: function component(_ref7) {
+      var children = _ref7.children,
+        parents = _ref7.parents;
       return /*#__PURE__*/React.createElement(Section, {
         testId: "insert-block-section",
         parents: parents,
@@ -167,9 +172,9 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
       key: TOOLBARS.PRIMARY_TOOLBAR,
       rank: TOOLBAR_RANK[LINKING_SECTION.key]
     }],
-    component: function component(_ref7) {
-      var children = _ref7.children,
-        parents = _ref7.parents;
+    component: function component(_ref8) {
+      var children = _ref8.children,
+        parents = _ref8.parents;
       return /*#__PURE__*/React.createElement(Section, {
         testId: "link-section",
         parents: parents,
@@ -201,8 +206,8 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
       key: OVERFLOW_GROUP.key,
       rank: OVERFLOW_GROUP_RANK[OVERFLOW_MENU.key]
     }],
-    component: function component(_ref8) {
-      var children = _ref8.children;
+    component: function component(_ref9) {
+      var children = _ref9.children;
       return /*#__PURE__*/React.createElement(OverflowMenu, null, children);
     }
   }, {
@@ -223,8 +228,8 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
         key: TOOLBARS.PRIMARY_TOOLBAR,
         rank: TOOLBAR_RANK[OVERFLOW_SECTION_PRIMARY_TOOLBAR.key]
       }],
-      component: function component(_ref9) {
-        var children = _ref9.children;
+      component: function component(_ref0) {
+        var children = _ref0.children;
         return /*#__PURE__*/React.createElement(OverflowSection, null, children);
       }
     }, {
@@ -243,8 +248,8 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
         key: OVERFLOW_GROUP_PRIMARY_TOOLBAR.key,
         rank: OVERFLOW_GROUP_PRIMARY_TOOLBAR_RANK[OVERFLOW_MENU_PRIMARY_TOOLBAR.key]
       }],
-      component: function component(_ref0) {
-        var children = _ref0.children;
+      component: function component(_ref1) {
+        var children = _ref1.children;
         return /*#__PURE__*/React.createElement(OverflowMenu, null, children);
       }
     });
@@ -255,16 +260,16 @@ export var getToolbarComponents = function getToolbarComponents(contextualFormat
         components.unshift.apply(components, _toConsumableArray(getInlineTextToolbarComponents()));
         break;
       case 'always-pinned':
-        components.unshift.apply(components, _toConsumableArray(getPrimaryToolbarComponents()));
+        components.unshift.apply(components, _toConsumableArray(getPrimaryToolbarComponents(breakpointPreset)));
         break;
       case 'controlled':
         components.unshift.apply(components, _toConsumableArray(getInlineTextToolbarComponents()));
-        components.unshift.apply(components, _toConsumableArray(getPrimaryToolbarComponents()));
+        components.unshift.apply(components, _toConsumableArray(getPrimaryToolbarComponents(breakpointPreset)));
         break;
     }
   } else {
     components.unshift.apply(components, _toConsumableArray(getInlineTextToolbarComponents()));
-    components.unshift.apply(components, _toConsumableArray(getPrimaryToolbarComponents()));
+    components.unshift.apply(components, _toConsumableArray(getPrimaryToolbarComponents(breakpointPreset)));
   }
   return components;
 };

package/dist/types/pm-plugins/experiences/selection-toolbar-open-experience.d.ts

@@ -1,5 +1,7 @@
+import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 type SelectionToolbarOpenExperienceOptions = {
+    dispatchAnalyticsEvent: DispatchAnalyticsEvent;
     refs: {
         popupsMountPoint?: HTMLElement;
     };
@@ -12,5 +14,5 @@ type SelectionToolbarOpenExperienceOptions = {
  * Failure: When 500ms passes without the selection toolbar being added to the DOM
  * Abort: When selection transition to empty or block menu is opened
  */
-export declare const getSelectionToolbarOpenExperiencePlugin: ({ refs, }: SelectionToolbarOpenExperienceOptions) => SafePlugin<{}>;
+export declare const getSelectionToolbarOpenExperiencePlugin: ({ refs, dispatchAnalyticsEvent, }: SelectionToolbarOpenExperienceOptions) => SafePlugin<{}>;
 export {};

package/dist/types/types/index.d.ts

@@ -1,6 +1,11 @@
 import type { ContextualFormattingEnabledOptions } from '@atlaskit/editor-common/toolbar';
+import type { BreakpointPreset } from '@atlaskit/editor-toolbar';
 import type { RegisterComponent } from '@atlaskit/editor-toolbar-model';
 export type ToolbarPluginOptions = {
+    /**
+     * Option to set the breakpoint preset for the toolbar.
+     */
+    breakpointPreset?: BreakpointPreset;
     /**
      * Controls which toolbars are available for in the editor.
      *

package/dist/types/ui/PrimaryToolbar.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
+import { type BreakpointPreset } from '@atlaskit/editor-toolbar';
 type PrimaryToolbarProps = {
+    breakpointPreset?: BreakpointPreset;
     children: React.ReactNode;
 };
-export declare const PrimaryToolbar: ({ children }: PrimaryToolbarProps) => React.JSX.Element;
+export declare const PrimaryToolbar: ({ children, breakpointPreset }: PrimaryToolbarProps) => React.JSX.Element;
 export {};

package/dist/types/ui/toolbar-components.d.ts

@@ -1,5 +1,6 @@
 import type { ContextualFormattingEnabledOptions } from '@atlaskit/editor-common/toolbar';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { type BreakpointPreset } from '@atlaskit/editor-toolbar';
 import { type RegisterComponent } from '@atlaskit/editor-toolbar-model';
 import type { ToolbarPlugin } from '../toolbarPluginType';
-export declare const getToolbarComponents: (contextualFormattingEnabled: ContextualFormattingEnabledOptions, api?: ExtractInjectionAPI<ToolbarPlugin>, disableSelectionToolbar?: boolean) => RegisterComponent[];
+export declare const getToolbarComponents: (contextualFormattingEnabled: ContextualFormattingEnabledOptions, api?: ExtractInjectionAPI<ToolbarPlugin>, disableSelectionToolbar?: boolean, breakpointPreset?: BreakpointPreset) => RegisterComponent[];

package/dist/types-ts4.5/pm-plugins/experiences/selection-toolbar-open-experience.d.ts

@@ -1,5 +1,7 @@
+import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 type SelectionToolbarOpenExperienceOptions = {
+    dispatchAnalyticsEvent: DispatchAnalyticsEvent;
     refs: {
         popupsMountPoint?: HTMLElement;
     };
@@ -12,5 +14,5 @@ type SelectionToolbarOpenExperienceOptions = {
  * Failure: When 500ms passes without the selection toolbar being added to the DOM
  * Abort: When selection transition to empty or block menu is opened
  */
-export declare const getSelectionToolbarOpenExperiencePlugin: ({ refs, }: SelectionToolbarOpenExperienceOptions) => SafePlugin<{}>;
+export declare const getSelectionToolbarOpenExperiencePlugin: ({ refs, dispatchAnalyticsEvent, }: SelectionToolbarOpenExperienceOptions) => SafePlugin<{}>;
 export {};

package/dist/types-ts4.5/types/index.d.ts

@@ -1,6 +1,11 @@
 import type { ContextualFormattingEnabledOptions } from '@atlaskit/editor-common/toolbar';
+import type { BreakpointPreset } from '@atlaskit/editor-toolbar';
 import type { RegisterComponent } from '@atlaskit/editor-toolbar-model';
 export type ToolbarPluginOptions = {
+    /**
+     * Option to set the breakpoint preset for the toolbar.
+     */
+    breakpointPreset?: BreakpointPreset;
     /**
      * Controls which toolbars are available for in the editor.
      *

package/dist/types-ts4.5/ui/PrimaryToolbar.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
+import { type BreakpointPreset } from '@atlaskit/editor-toolbar';
 type PrimaryToolbarProps = {
+    breakpointPreset?: BreakpointPreset;
     children: React.ReactNode;
 };
-export declare const PrimaryToolbar: ({ children }: PrimaryToolbarProps) => React.JSX.Element;
+export declare const PrimaryToolbar: ({ children, breakpointPreset }: PrimaryToolbarProps) => React.JSX.Element;
 export {};

package/dist/types-ts4.5/ui/toolbar-components.d.ts

@@ -1,5 +1,6 @@
 import type { ContextualFormattingEnabledOptions } from '@atlaskit/editor-common/toolbar';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { type BreakpointPreset } from '@atlaskit/editor-toolbar';
 import { type RegisterComponent } from '@atlaskit/editor-toolbar-model';
 import type { ToolbarPlugin } from '../toolbarPluginType';
-export declare const getToolbarComponents: (contextualFormattingEnabled: ContextualFormattingEnabledOptions, api?: ExtractInjectionAPI<ToolbarPlugin>, disableSelectionToolbar?: boolean) => RegisterComponent[];
+export declare const getToolbarComponents: (contextualFormattingEnabled: ContextualFormattingEnabledOptions, api?: ExtractInjectionAPI<ToolbarPlugin>, disableSelectionToolbar?: boolean, breakpointPreset?: BreakpointPreset) => RegisterComponent[];

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-toolbar",
-	"version": "3.4.5",
+	"version": "3.4.7",
 	"description": "Toolbar plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -40,13 +40,13 @@
 		"@atlaskit/editor-toolbar-model": "^0.2.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/platform-feature-flags-react": "^0.4.0",
-		"@atlaskit/tmp-editor-statsig": "^13.24.0",
+		"@atlaskit/tmp-editor-statsig": "^13.35.0",
 		"@babel/runtime": "^7.0.0",
 		"bind-event-listener": "^3.0.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^110.20.0",
+		"@atlaskit/editor-common": "^110.27.0",
 		"react": "^18.2.0"
 	},
 	"platform-feature-flags": {

package/afm-post-office/tsconfig.json

@@ -1,60 +0,0 @@
-{
-	"extends": "../../../../tsconfig.entry-points.post-office.json",
-	"compilerOptions": {
-		"target": "es5",
-		"outDir": "../../../../../post-office/tsDist/@atlaskit__editor-plugin-toolbar/app",
-		"rootDir": "../",
-		"composite": true
-	},
-	"include": [
-		"../src/**/*.ts",
-		"../src/**/*.tsx"
-	],
-	"exclude": [
-		"../src/**/__tests__/*",
-		"../src/**/*.test.*",
-		"../src/**/test.*",
-		"../src/**/examples.*"
-	],
-	"references": [
-		{
-			"path": "../../../helpers/browser-apis/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-plugin-analytics/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-plugin-connectivity/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-plugin-editor-viewmode/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-plugin-selection/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-plugin-user-intent/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-plugin-user-preferences/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-toolbar/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-toolbar-model/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../../platform/feature-flags/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../../platform/feature-flags-react/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../tmp-editor-statsig/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-common/afm-post-office/tsconfig.json"
-		}
-	]
-}