@atlaskit/editor-toolbar 0.8.6 → 0.9.0

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/editor-toolbar
 
+## 0.9.0
+
+### Minor Changes
+
+- [`553afc302139b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/553afc302139b) -
+  Add analytic emitter component which fires an event when dropdowns are viewed
+
+### Patch Changes
+
+- Updated dependencies
+
+## 0.8.7
+
+### Patch Changes
+
+- [`08039ab948fd7`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/08039ab948fd7) -
+  [ux] [ED-28824] add optional props to support confluence renderer toolbar implementation
+- Updated dependencies
+
 ## 0.8.6
 
 ### Patch Changes

package/dist/cjs/hooks/ui-context.js

@@ -11,7 +11,8 @@ var ToolbarUIContext = /*#__PURE__*/(0, _react.createContext)({
   onDropdownOpenChanged: function onDropdownOpenChanged() {},
   preventDefaultOnMouseDown: false,
   isDisabled: false,
-  popupsMountPoint: undefined
+  popupsMountPoint: undefined,
+  fireAnalyticsEvent: undefined
 });
 
 /**
@@ -31,7 +32,8 @@ var ToolbarUIProvider = exports.ToolbarUIProvider = function ToolbarUIProvider(_
     isDisabled = _ref.isDisabled,
     popupsMountPoint = _ref.popupsMountPoint,
     popupsBoundariesElement = _ref.popupsBoundariesElement,
-    popupsScrollableElement = _ref.popupsScrollableElement;
+    popupsScrollableElement = _ref.popupsScrollableElement,
+    fireAnalyticsEvent = _ref.fireAnalyticsEvent;
   return /*#__PURE__*/_react.default.createElement(ToolbarUIContext.Provider, {
     value: {
       onDropdownOpenChanged: onDropdownOpenChanged,
@@ -39,7 +41,8 @@ var ToolbarUIProvider = exports.ToolbarUIProvider = function ToolbarUIProvider(_
       isDisabled: isDisabled,
       popupsMountPoint: popupsMountPoint,
       popupsBoundariesElement: popupsBoundariesElement,
-      popupsScrollableElement: popupsScrollableElement
+      popupsScrollableElement: popupsScrollableElement,
+      fireAnalyticsEvent: fireAnalyticsEvent
     }
   }, children);
 };

package/dist/cjs/index.js

@@ -136,6 +136,12 @@ Object.defineProperty(exports, "CommentIcon", {
     return _CommentIcon.CommentIcon;
   }
 });
+Object.defineProperty(exports, "DefineIcon", {
+  enumerable: true,
+  get: function get() {
+    return _DefineIcon.DefineIcon;
+  }
+});
 Object.defineProperty(exports, "EmojiIcon", {
   enumerable: true,
   get: function get() {
@@ -268,6 +274,12 @@ Object.defineProperty(exports, "PinnedIcon", {
     return _PinnedIcon.PinnedIcon;
   }
 });
+Object.defineProperty(exports, "PlusIcon", {
+  enumerable: true,
+  get: function get() {
+    return _PlusIcon.PlusIcon;
+  }
+});
 Object.defineProperty(exports, "PrimaryToolbar", {
   enumerable: true,
   get: function get() {
@@ -485,6 +497,7 @@ var _AddIcon = require("./ui/icons/AddIcon");
 var _AppsIcon = require("./ui/icons/AppsIcon");
 var _BoldIcon = require("./ui/icons/BoldIcon");
 var _CommentIcon = require("./ui/icons/CommentIcon");
+var _DefineIcon = require("./ui/icons/DefineIcon");
 var _HeadingFiveIcon = require("./ui/icons/HeadingFiveIcon");
 var _HeadingFourIcon = require("./ui/icons/HeadingFourIcon");
 var _HeadingOneIcon = require("./ui/icons/HeadingOneIcon");
@@ -523,6 +536,7 @@ var _UndoIcon = require("./ui/icons/UndoIcon");
 var _RedoIcon = require("./ui/icons/RedoIcon");
 var _HistoryIcon = require("./ui/icons/HistoryIcon");
 var _LoomIcon = require("./ui/icons/LoomIcon");
+var _PlusIcon = require("./ui/icons/PlusIcon");
 var _ColorPalette = _interopRequireDefault(require("./ui/ColorPalette"));
 var _utils = require("./ui/ColorPalette/utils");
 var _uiContext = require("./hooks/ui-context");

package/dist/cjs/ui/Toolbar.js

@@ -15,6 +15,7 @@ var _css = require("@atlaskit/css");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _ResponsiveContainer = require("./ResponsiveContainer");
+var _ViewEventEmitter = require("./ViewEventEmitter");
 var styles = {
   toolbarBase: "_2rko1qi0 _zulp1b66 _1e0c1txw _4cvr1h6o",
   toolbar: "_bfhk1bhr _4t3i14no _u5f31b66 _19bv1b66 _16qs1cd0",
@@ -29,13 +30,17 @@ var styles = {
  */
 var Toolbar = exports.Toolbar = function Toolbar(_ref) {
   var children = _ref.children,
-    label = _ref.label;
+    label = _ref.label,
+    actionSubjectId = _ref.actionSubjectId;
   var isResponsiveEnabled = (0, _expValEquals.expValEquals)('platform_editor_aifc_selection_toolbar_responsive', 'isEnabled', true);
   var toolbar = /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     xcss: (0, _css.cx)(styles.toolbarBase, styles.toolbar, isResponsiveEnabled && styles.toolbarResponsive, (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) && styles.hiddenSelectors),
     role: "toolbar",
     "aria-label": label
-  }, children);
+  }, (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_toolbar_analytic', 'isEnabled', true) ? /*#__PURE__*/_react.default.createElement(_ViewEventEmitter.ViewEventEmitter, {
+    actionSubject: _ViewEventEmitter.ACTION_SUBJECT.TOOLBAR,
+    actionSubjectId: actionSubjectId
+  }) : null, children);
   if (isResponsiveEnabled) {
     return /*#__PURE__*/_react.default.createElement(_ResponsiveContainer.ResponsiveWrapper, null, toolbar);
   } else {

package/dist/cjs/ui/ToolbarButton.js

@@ -33,7 +33,8 @@ var ToolbarButton = exports.ToolbarButton = /*#__PURE__*/(0, _react.forwardRef)(
     testId = _ref.testId,
     isDisabled = _ref.isDisabled,
     ariaKeyshortcuts = _ref.ariaKeyshortcuts,
-    label = _ref.label;
+    label = _ref.label,
+    interactionName = _ref.interactionName;
   var _useToolbarUI = (0, _uiContext.useToolbarUI)(),
     preventDefaultOnMouseDown = _useToolbarUI.preventDefaultOnMouseDown,
     ctxDisabled = _useToolbarUI.isDisabled;
@@ -58,6 +59,7 @@ var ToolbarButton = exports.ToolbarButton = /*#__PURE__*/(0, _react.forwardRef)(
         event.preventDefault();
       }
     },
-    "data-toolbar-component": "button"
+    "data-toolbar-component": "button",
+    interactionName: interactionName
   }, iconBefore, children);
 });

package/dist/cjs/ui/ToolbarDropdownItem.js

@@ -52,6 +52,8 @@ var ToolbarDropdownItem = exports.ToolbarDropdownItem = function ToolbarDropdown
     isDisabled = _ref2.isDisabled,
     hasNestedDropdownMenu = _ref2.hasNestedDropdownMenu,
     triggerRef = _ref2.triggerRef,
+    _ref2$shouldTitleWrap = _ref2.shouldTitleWrap,
+    shouldTitleWrap = _ref2$shouldTitleWrap === void 0 ? true : _ref2$shouldTitleWrap,
     testId = _ref2.testId,
     ariaKeyshortcuts = _ref2.ariaKeyshortcuts,
     href = _ref2.href,
@@ -78,6 +80,7 @@ var ToolbarDropdownItem = exports.ToolbarDropdownItem = function ToolbarDropdown
     rel: rel,
     component: href && (0, _expValEquals.expValEquals)('platform_editor_toolbar_migrate_loom', 'isEnabled', true) ? undefined : CustomDropdownMenuItemButton,
     testId: testId,
-    "data-toolbar-component": "menu-item"
+    "data-toolbar-component": "menu-item",
+    shouldTitleWrap: shouldTitleWrap
   }, children);
 };

package/dist/cjs/ui/ToolbarDropdownItemSection.js

@@ -10,10 +10,12 @@ var _dropdownMenu = require("@atlaskit/dropdown-menu");
 var ToolbarDropdownItemSection = exports.ToolbarDropdownItemSection = function ToolbarDropdownItemSection(_ref) {
   var children = _ref.children,
     hasSeparator = _ref.hasSeparator,
-    title = _ref.title;
+    title = _ref.title,
+    testId = _ref.testId;
   return /*#__PURE__*/_react.default.createElement(_dropdownMenu.DropdownItemGroup, {
     hasSeparator: hasSeparator,
     title: title,
-    "data-toolbar-component": "menu-section"
+    "data-toolbar-component": "menu-section",
+    testId: testId
   }, children);
 };

package/dist/cjs/ui/ToolbarDropdownMenu.js

@@ -56,9 +56,9 @@ var ToolbarDropdownMenuContent = function ToolbarDropdownMenuContent(_ref) {
         "aria-controls": triggerProps['aria-controls'],
         onBlur: triggerProps.onBlur,
         onClick: function onClick(e) {
+          _onClick && _onClick(e, !(menuContext !== null && menuContext !== void 0 && menuContext.isOpen));
           handleClick();
           triggerProps.onClick && triggerProps.onClick(e);
-          _onClick && _onClick(e);
         },
         onFocus: triggerProps.onFocus,
         testId: testId,

package/dist/cjs/ui/ToolbarNestedDropdownMenu.js

@@ -27,7 +27,8 @@ var ToolbarNestedDropdownMenu = exports.ToolbarNestedDropdownMenu = function Too
     isDisabled = _ref.isDisabled,
     testId = _ref.testId,
     _ref$enableMaxHeight = _ref.enableMaxHeight,
-    enableMaxHeight = _ref$enableMaxHeight === void 0 ? false : _ref$enableMaxHeight;
+    enableMaxHeight = _ref$enableMaxHeight === void 0 ? false : _ref$enableMaxHeight,
+    _onClick = _ref.onClick;
   return /*#__PURE__*/React.createElement(_dropdownMenu.default, {
     placement: "right-start",
     trigger: function trigger(triggerProps) {
@@ -35,7 +36,10 @@ var ToolbarNestedDropdownMenu = exports.ToolbarNestedDropdownMenu = function Too
         elemBefore: elemBefore,
         elemAfter: elemAfter,
         isSelected: triggerProps.isSelected,
-        onClick: triggerProps.onClick,
+        onClick: function onClick(e) {
+          _onClick && _onClick(e);
+          triggerProps.onClick && triggerProps.onClick(e);
+        },
         testId: testId,
         triggerRef: triggerProps.triggerRef,
         hasNestedDropdownMenu: true,

package/dist/cjs/ui/ToolbarTooltip.js

@@ -11,9 +11,11 @@ var ToolbarTooltip = exports.ToolbarTooltip = function ToolbarTooltip(_ref) {
   var content = _ref.content,
     children = _ref.children,
     _ref$position = _ref.position,
-    position = _ref$position === void 0 ? 'top' : _ref$position;
+    position = _ref$position === void 0 ? 'top' : _ref$position,
+    delay = _ref.delay;
   return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     content: content,
-    position: position
+    position: position,
+    delay: delay
   }, children);
 };

package/dist/cjs/ui/ViewEventEmitter.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ViewEventEmitter = exports.ACTION_SUBJECT = void 0;
+var _react = require("react");
+var _uiContext = require("../hooks/ui-context");
+var ACTION_SUBJECT = exports.ACTION_SUBJECT = {
+  TOOLBAR: 'toolbar',
+  TOOLBAR_DROPDOWN_MENU: 'toolbarDropdownMenu'
+};
+var ViewEventEmitter = exports.ViewEventEmitter = function ViewEventEmitter(_ref) {
+  var actionSubjectId = _ref.actionSubjectId,
+    actionSubject = _ref.actionSubject;
+  var isMountedRef = (0, _react.useRef)(false);
+  var _useToolbarUI = (0, _uiContext.useToolbarUI)(),
+    fireAnalyticsEvent = _useToolbarUI.fireAnalyticsEvent;
+  (0, _react.useEffect)(function () {
+    if (isMountedRef.current) {
+      return;
+    }
+    isMountedRef.current = true;
+    var payload = {
+      action: 'viewed',
+      actionSubject: actionSubject,
+      actionSubjectId: actionSubjectId,
+      eventType: 'ui'
+    };
+    fireAnalyticsEvent && fireAnalyticsEvent(payload);
+  }, [actionSubjectId, actionSubject, fireAnalyticsEvent]);
+  return null;
+};

package/dist/cjs/ui/icons/DefineIcon.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "DefineIcon", {
+  enumerable: true,
+  get: function get() {
+    return _informationCircle.default;
+  }
+});
+var _informationCircle = _interopRequireDefault(require("@atlaskit/icon/core/information-circle"));

package/dist/cjs/ui/icons/PlusIcon.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "PlusIcon", {
+  enumerable: true,
+  get: function get() {
+    return _plusSquare.default;
+  }
+});
+var _plusSquare = _interopRequireDefault(require("@atlaskit/icon/core/plus-square"));

package/dist/es2019/hooks/ui-context.js

@@ -3,7 +3,8 @@ const ToolbarUIContext = /*#__PURE__*/createContext({
   onDropdownOpenChanged: () => {},
   preventDefaultOnMouseDown: false,
   isDisabled: false,
-  popupsMountPoint: undefined
+  popupsMountPoint: undefined,
+  fireAnalyticsEvent: undefined
 });
 
 /**
@@ -23,7 +24,8 @@ export const ToolbarUIProvider = ({
   isDisabled,
   popupsMountPoint,
   popupsBoundariesElement,
-  popupsScrollableElement
+  popupsScrollableElement,
+  fireAnalyticsEvent
 }) => {
   return /*#__PURE__*/React.createElement(ToolbarUIContext.Provider, {
     value: {
@@ -32,7 +34,8 @@ export const ToolbarUIProvider = ({
       isDisabled,
       popupsMountPoint,
       popupsBoundariesElement,
-      popupsScrollableElement
+      popupsScrollableElement,
+      fireAnalyticsEvent
     }
   }, children);
 };

package/dist/es2019/index.js

@@ -30,6 +30,7 @@ export { AddIcon } from './ui/icons/AddIcon';
 export { AppsIcon } from './ui/icons/AppsIcon';
 export { BoldIcon } from './ui/icons/BoldIcon';
 export { CommentIcon } from './ui/icons/CommentIcon';
+export { DefineIcon } from './ui/icons/DefineIcon';
 export { HeadingFiveIcon } from './ui/icons/HeadingFiveIcon';
 export { HeadingFourIcon } from './ui/icons/HeadingFourIcon';
 export { HeadingOneIcon } from './ui/icons/HeadingOneIcon';
@@ -68,6 +69,7 @@ export { UndoIcon } from './ui/icons/UndoIcon';
 export { RedoIcon } from './ui/icons/RedoIcon';
 export { HistoryIcon } from './ui/icons/HistoryIcon';
 export { LoomIcon } from './ui/icons/LoomIcon';
+export { PlusIcon } from './ui/icons/PlusIcon';
 export { default as ColorPalette } from './ui/ColorPalette';
 export { getContrastingBackgroundColor } from './ui/ColorPalette/utils';
 export { useToolbarUI, ToolbarUIProvider } from './hooks/ui-context';

package/dist/es2019/ui/Toolbar.js

@@ -8,6 +8,7 @@ import { cx } from '@atlaskit/css';
 import { Box } from '@atlaskit/primitives/compiled';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ResponsiveContainer, ResponsiveWrapper } from './ResponsiveContainer';
+import { ACTION_SUBJECT, ViewEventEmitter } from './ViewEventEmitter';
 const styles = {
   toolbarBase: "_2rko1qi0 _zulp1b66 _1e0c1txw _4cvr1h6o",
   toolbar: "_bfhk1bhr _4t3i14no _u5f31b66 _19bv1b66 _16qs1cd0",
@@ -22,14 +23,18 @@ const styles = {
  */
 export const Toolbar = ({
   children,
-  label
+  label,
+  actionSubjectId
 }) => {
   const isResponsiveEnabled = expValEquals('platform_editor_aifc_selection_toolbar_responsive', 'isEnabled', true);
   const toolbar = /*#__PURE__*/React.createElement(Box, {
     xcss: cx(styles.toolbarBase, styles.toolbar, isResponsiveEnabled && styles.toolbarResponsive, expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) && styles.hiddenSelectors),
     role: "toolbar",
     "aria-label": label
-  }, children);
+  }, expValEquals('platform_editor_toolbar_aifc_toolbar_analytic', 'isEnabled', true) ? /*#__PURE__*/React.createElement(ViewEventEmitter, {
+    actionSubject: ACTION_SUBJECT.TOOLBAR,
+    actionSubjectId: actionSubjectId
+  }) : null, children);
   if (isResponsiveEnabled) {
     return /*#__PURE__*/React.createElement(ResponsiveWrapper, null, toolbar);
   } else {

package/dist/es2019/ui/ToolbarButton.js

@@ -25,7 +25,8 @@ export const ToolbarButton = /*#__PURE__*/forwardRef(({
   testId,
   isDisabled,
   ariaKeyshortcuts,
-  label
+  label,
+  interactionName
 }, ref) => {
   const {
     preventDefaultOnMouseDown,
@@ -52,6 +53,7 @@ export const ToolbarButton = /*#__PURE__*/forwardRef(({
         event.preventDefault();
       }
     },
-    "data-toolbar-component": "button"
+    "data-toolbar-component": "button",
+    interactionName: interactionName
   }, iconBefore, children);
 });

package/dist/es2019/ui/ToolbarDropdownItem.js

@@ -43,6 +43,7 @@ export const ToolbarDropdownItem = ({
   isDisabled,
   hasNestedDropdownMenu,
   triggerRef,
+  shouldTitleWrap = true,
   testId,
   ariaKeyshortcuts,
   href,
@@ -70,6 +71,7 @@ export const ToolbarDropdownItem = ({
     rel: rel,
     component: href && expValEquals('platform_editor_toolbar_migrate_loom', 'isEnabled', true) ? undefined : CustomDropdownMenuItemButton,
     testId: testId,
-    "data-toolbar-component": "menu-item"
+    "data-toolbar-component": "menu-item",
+    shouldTitleWrap: shouldTitleWrap
   }, children);
 };

package/dist/es2019/ui/ToolbarDropdownItemSection.js

@@ -3,11 +3,13 @@ import { DropdownItemGroup } from '@atlaskit/dropdown-menu';
 export const ToolbarDropdownItemSection = ({
   children,
   hasSeparator,
-  title
+  title,
+  testId
 }) => {
   return /*#__PURE__*/React.createElement(DropdownItemGroup, {
     hasSeparator: hasSeparator,
     title: title,
-    "data-toolbar-component": "menu-section"
+    "data-toolbar-component": "menu-section",
+    testId: testId
   }, children);
 };

package/dist/es2019/ui/ToolbarDropdownMenu.js

@@ -48,9 +48,9 @@ const ToolbarDropdownMenuContent = ({
       "aria-controls": triggerProps['aria-controls'],
       onBlur: triggerProps.onBlur,
       onClick: e => {
+        onClick && onClick(e, !(menuContext !== null && menuContext !== void 0 && menuContext.isOpen));
         handleClick();
         triggerProps.onClick && triggerProps.onClick(e);
-        onClick && onClick(e);
       },
       onFocus: triggerProps.onFocus,
       testId: testId,

package/dist/es2019/ui/ToolbarNestedDropdownMenu.js

@@ -17,7 +17,8 @@ export const ToolbarNestedDropdownMenu = ({
   children,
   isDisabled,
   testId,
-  enableMaxHeight = false
+  enableMaxHeight = false,
+  onClick
 }) => {
   return /*#__PURE__*/React.createElement(DropdownMenu, {
     placement: "right-start",
@@ -25,7 +26,10 @@ export const ToolbarNestedDropdownMenu = ({
       elemBefore: elemBefore,
       elemAfter: elemAfter,
       isSelected: triggerProps.isSelected,
-      onClick: triggerProps.onClick,
+      onClick: e => {
+        onClick && onClick(e);
+        triggerProps.onClick && triggerProps.onClick(e);
+      },
       testId: testId,
       triggerRef: triggerProps.triggerRef,
       hasNestedDropdownMenu: true,

package/dist/es2019/ui/ToolbarTooltip.js

@@ -3,10 +3,12 @@ import Tooltip from '@atlaskit/tooltip';
 export const ToolbarTooltip = ({
   content,
   children,
-  position = 'top'
+  position = 'top',
+  delay
 }) => {
   return /*#__PURE__*/React.createElement(Tooltip, {
     content: content,
-    position: position
+    position: position,
+    delay: delay
   }, children);
 };

package/dist/es2019/ui/ViewEventEmitter.js

@@ -0,0 +1,29 @@
+import { useEffect, useRef } from 'react';
+import { useToolbarUI } from '../hooks/ui-context';
+export const ACTION_SUBJECT = {
+  TOOLBAR: 'toolbar',
+  TOOLBAR_DROPDOWN_MENU: 'toolbarDropdownMenu'
+};
+export const ViewEventEmitter = ({
+  actionSubjectId,
+  actionSubject
+}) => {
+  const isMountedRef = useRef(false);
+  const {
+    fireAnalyticsEvent
+  } = useToolbarUI();
+  useEffect(() => {
+    if (isMountedRef.current) {
+      return;
+    }
+    isMountedRef.current = true;
+    const payload = {
+      action: 'viewed',
+      actionSubject,
+      actionSubjectId,
+      eventType: 'ui'
+    };
+    fireAnalyticsEvent && fireAnalyticsEvent(payload);
+  }, [actionSubjectId, actionSubject, fireAnalyticsEvent]);
+  return null;
+};

package/dist/es2019/ui/icons/DefineIcon.js

@@ -0,0 +1,2 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+export { default as DefineIcon } from '@atlaskit/icon/core/information-circle';

package/dist/es2019/ui/icons/PlusIcon.js

@@ -0,0 +1,2 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+export { default as PlusIcon } from '@atlaskit/icon/core/plus-square';

package/dist/esm/hooks/ui-context.js

@@ -3,7 +3,8 @@ var ToolbarUIContext = /*#__PURE__*/createContext({
   onDropdownOpenChanged: function onDropdownOpenChanged() {},
   preventDefaultOnMouseDown: false,
   isDisabled: false,
-  popupsMountPoint: undefined
+  popupsMountPoint: undefined,
+  fireAnalyticsEvent: undefined
 });
 
 /**
@@ -23,7 +24,8 @@ export var ToolbarUIProvider = function ToolbarUIProvider(_ref) {
     isDisabled = _ref.isDisabled,
     popupsMountPoint = _ref.popupsMountPoint,
     popupsBoundariesElement = _ref.popupsBoundariesElement,
-    popupsScrollableElement = _ref.popupsScrollableElement;
+    popupsScrollableElement = _ref.popupsScrollableElement,
+    fireAnalyticsEvent = _ref.fireAnalyticsEvent;
   return /*#__PURE__*/React.createElement(ToolbarUIContext.Provider, {
     value: {
       onDropdownOpenChanged: onDropdownOpenChanged,
@@ -31,7 +33,8 @@ export var ToolbarUIProvider = function ToolbarUIProvider(_ref) {
       isDisabled: isDisabled,
       popupsMountPoint: popupsMountPoint,
       popupsBoundariesElement: popupsBoundariesElement,
-      popupsScrollableElement: popupsScrollableElement
+      popupsScrollableElement: popupsScrollableElement,
+      fireAnalyticsEvent: fireAnalyticsEvent
     }
   }, children);
 };

package/dist/esm/index.js

@@ -30,6 +30,7 @@ export { AddIcon } from './ui/icons/AddIcon';
 export { AppsIcon } from './ui/icons/AppsIcon';
 export { BoldIcon } from './ui/icons/BoldIcon';
 export { CommentIcon } from './ui/icons/CommentIcon';
+export { DefineIcon } from './ui/icons/DefineIcon';
 export { HeadingFiveIcon } from './ui/icons/HeadingFiveIcon';
 export { HeadingFourIcon } from './ui/icons/HeadingFourIcon';
 export { HeadingOneIcon } from './ui/icons/HeadingOneIcon';
@@ -68,6 +69,7 @@ export { UndoIcon } from './ui/icons/UndoIcon';
 export { RedoIcon } from './ui/icons/RedoIcon';
 export { HistoryIcon } from './ui/icons/HistoryIcon';
 export { LoomIcon } from './ui/icons/LoomIcon';
+export { PlusIcon } from './ui/icons/PlusIcon';
 export { default as ColorPalette } from './ui/ColorPalette';
 export { getContrastingBackgroundColor } from './ui/ColorPalette/utils';
 export { useToolbarUI, ToolbarUIProvider } from './hooks/ui-context';

package/dist/esm/ui/Toolbar.js

@@ -8,6 +8,7 @@ import { cx } from '@atlaskit/css';
 import { Box } from '@atlaskit/primitives/compiled';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ResponsiveContainer, ResponsiveWrapper } from './ResponsiveContainer';
+import { ACTION_SUBJECT, ViewEventEmitter } from './ViewEventEmitter';
 var styles = {
   toolbarBase: "_2rko1qi0 _zulp1b66 _1e0c1txw _4cvr1h6o",
   toolbar: "_bfhk1bhr _4t3i14no _u5f31b66 _19bv1b66 _16qs1cd0",
@@ -22,13 +23,17 @@ var styles = {
  */
 export var Toolbar = function Toolbar(_ref) {
   var children = _ref.children,
-    label = _ref.label;
+    label = _ref.label,
+    actionSubjectId = _ref.actionSubjectId;
   var isResponsiveEnabled = expValEquals('platform_editor_aifc_selection_toolbar_responsive', 'isEnabled', true);
   var toolbar = /*#__PURE__*/React.createElement(Box, {
     xcss: cx(styles.toolbarBase, styles.toolbar, isResponsiveEnabled && styles.toolbarResponsive, expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) && styles.hiddenSelectors),
     role: "toolbar",
     "aria-label": label
-  }, children);
+  }, expValEquals('platform_editor_toolbar_aifc_toolbar_analytic', 'isEnabled', true) ? /*#__PURE__*/React.createElement(ViewEventEmitter, {
+    actionSubject: ACTION_SUBJECT.TOOLBAR,
+    actionSubjectId: actionSubjectId
+  }) : null, children);
   if (isResponsiveEnabled) {
     return /*#__PURE__*/React.createElement(ResponsiveWrapper, null, toolbar);
   } else {

package/dist/esm/ui/ToolbarButton.js

@@ -25,7 +25,8 @@ export var ToolbarButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
     testId = _ref.testId,
     isDisabled = _ref.isDisabled,
     ariaKeyshortcuts = _ref.ariaKeyshortcuts,
-    label = _ref.label;
+    label = _ref.label,
+    interactionName = _ref.interactionName;
   var _useToolbarUI = useToolbarUI(),
     preventDefaultOnMouseDown = _useToolbarUI.preventDefaultOnMouseDown,
     ctxDisabled = _useToolbarUI.isDisabled;
@@ -50,6 +51,7 @@ export var ToolbarButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
         event.preventDefault();
       }
     },
-    "data-toolbar-component": "button"
+    "data-toolbar-component": "button",
+    interactionName: interactionName
   }, iconBefore, children);
 });

package/dist/esm/ui/ToolbarDropdownItem.js

@@ -44,6 +44,8 @@ export var ToolbarDropdownItem = function ToolbarDropdownItem(_ref2) {
     isDisabled = _ref2.isDisabled,
     hasNestedDropdownMenu = _ref2.hasNestedDropdownMenu,
     triggerRef = _ref2.triggerRef,
+    _ref2$shouldTitleWrap = _ref2.shouldTitleWrap,
+    shouldTitleWrap = _ref2$shouldTitleWrap === void 0 ? true : _ref2$shouldTitleWrap,
     testId = _ref2.testId,
     ariaKeyshortcuts = _ref2.ariaKeyshortcuts,
     href = _ref2.href,
@@ -70,6 +72,7 @@ export var ToolbarDropdownItem = function ToolbarDropdownItem(_ref2) {
     rel: rel,
     component: href && expValEquals('platform_editor_toolbar_migrate_loom', 'isEnabled', true) ? undefined : CustomDropdownMenuItemButton,
     testId: testId,
-    "data-toolbar-component": "menu-item"
+    "data-toolbar-component": "menu-item",
+    shouldTitleWrap: shouldTitleWrap
   }, children);
 };

package/dist/esm/ui/ToolbarDropdownItemSection.js

@@ -3,10 +3,12 @@ import { DropdownItemGroup } from '@atlaskit/dropdown-menu';
 export var ToolbarDropdownItemSection = function ToolbarDropdownItemSection(_ref) {
   var children = _ref.children,
     hasSeparator = _ref.hasSeparator,
-    title = _ref.title;
+    title = _ref.title,
+    testId = _ref.testId;
   return /*#__PURE__*/React.createElement(DropdownItemGroup, {
     hasSeparator: hasSeparator,
     title: title,
-    "data-toolbar-component": "menu-section"
+    "data-toolbar-component": "menu-section",
+    testId: testId
   }, children);
 };

package/dist/esm/ui/ToolbarDropdownMenu.js

@@ -47,9 +47,9 @@ var ToolbarDropdownMenuContent = function ToolbarDropdownMenuContent(_ref) {
         "aria-controls": triggerProps['aria-controls'],
         onBlur: triggerProps.onBlur,
         onClick: function onClick(e) {
+          _onClick && _onClick(e, !(menuContext !== null && menuContext !== void 0 && menuContext.isOpen));
           handleClick();
           triggerProps.onClick && triggerProps.onClick(e);
-          _onClick && _onClick(e);
         },
         onFocus: triggerProps.onFocus,
         testId: testId,

package/dist/esm/ui/ToolbarNestedDropdownMenu.js

@@ -18,7 +18,8 @@ export var ToolbarNestedDropdownMenu = function ToolbarNestedDropdownMenu(_ref)
     isDisabled = _ref.isDisabled,
     testId = _ref.testId,
     _ref$enableMaxHeight = _ref.enableMaxHeight,
-    enableMaxHeight = _ref$enableMaxHeight === void 0 ? false : _ref$enableMaxHeight;
+    enableMaxHeight = _ref$enableMaxHeight === void 0 ? false : _ref$enableMaxHeight,
+    _onClick = _ref.onClick;
   return /*#__PURE__*/React.createElement(DropdownMenu, {
     placement: "right-start",
     trigger: function trigger(triggerProps) {
@@ -26,7 +27,10 @@ export var ToolbarNestedDropdownMenu = function ToolbarNestedDropdownMenu(_ref)
         elemBefore: elemBefore,
         elemAfter: elemAfter,
         isSelected: triggerProps.isSelected,
-        onClick: triggerProps.onClick,
+        onClick: function onClick(e) {
+          _onClick && _onClick(e);
+          triggerProps.onClick && triggerProps.onClick(e);
+        },
         testId: testId,
         triggerRef: triggerProps.triggerRef,
         hasNestedDropdownMenu: true,

package/dist/esm/ui/ToolbarTooltip.js

@@ -4,9 +4,11 @@ export var ToolbarTooltip = function ToolbarTooltip(_ref) {
   var content = _ref.content,
     children = _ref.children,
     _ref$position = _ref.position,
-    position = _ref$position === void 0 ? 'top' : _ref$position;
+    position = _ref$position === void 0 ? 'top' : _ref$position,
+    delay = _ref.delay;
   return /*#__PURE__*/React.createElement(Tooltip, {
     content: content,
-    position: position
+    position: position,
+    delay: delay
   }, children);
 };

package/dist/esm/ui/ViewEventEmitter.js

@@ -0,0 +1,27 @@
+import { useEffect, useRef } from 'react';
+import { useToolbarUI } from '../hooks/ui-context';
+export var ACTION_SUBJECT = {
+  TOOLBAR: 'toolbar',
+  TOOLBAR_DROPDOWN_MENU: 'toolbarDropdownMenu'
+};
+export var ViewEventEmitter = function ViewEventEmitter(_ref) {
+  var actionSubjectId = _ref.actionSubjectId,
+    actionSubject = _ref.actionSubject;
+  var isMountedRef = useRef(false);
+  var _useToolbarUI = useToolbarUI(),
+    fireAnalyticsEvent = _useToolbarUI.fireAnalyticsEvent;
+  useEffect(function () {
+    if (isMountedRef.current) {
+      return;
+    }
+    isMountedRef.current = true;
+    var payload = {
+      action: 'viewed',
+      actionSubject: actionSubject,
+      actionSubjectId: actionSubjectId,
+      eventType: 'ui'
+    };
+    fireAnalyticsEvent && fireAnalyticsEvent(payload);
+  }, [actionSubjectId, actionSubject, fireAnalyticsEvent]);
+  return null;
+};

package/dist/esm/ui/icons/DefineIcon.js

@@ -0,0 +1,2 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+export { default as DefineIcon } from '@atlaskit/icon/core/information-circle';

package/dist/esm/ui/icons/PlusIcon.js

@@ -0,0 +1,2 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+export { default as PlusIcon } from '@atlaskit/icon/core/plus-square';

package/dist/types/hooks/ui-context.d.ts

@@ -1,6 +1,14 @@
 import React from 'react';
 import type { OnOpenChangeArgs } from '@atlaskit/dropdown-menu';
+type AnalyticsEventPayload = {
+    action: string;
+    actionSubject?: string;
+    actionSubjectId?: string;
+    eventType: string;
+};
+type FireAnalyticsEvent = (payload: AnalyticsEventPayload) => void | undefined;
 export type ToolbarUIContextType = {
+    fireAnalyticsEvent?: FireAnalyticsEvent;
     /**
      * Indicates whether the toolbar is disabled when the editor is offline.
      */
@@ -26,5 +34,5 @@ export declare const useToolbarUI: () => ToolbarUIContextType;
 type ToolbarUIProviderProps = {
     children: React.ReactNode;
 } & ToolbarUIContextType;
-export declare const ToolbarUIProvider: ({ children, onDropdownOpenChanged, preventDefaultOnMouseDown, isDisabled, popupsMountPoint, popupsBoundariesElement, popupsScrollableElement, }: ToolbarUIProviderProps) => React.JSX.Element;
+export declare const ToolbarUIProvider: ({ children, onDropdownOpenChanged, preventDefaultOnMouseDown, isDisabled, popupsMountPoint, popupsBoundariesElement, popupsScrollableElement, fireAnalyticsEvent, }: ToolbarUIProviderProps) => React.JSX.Element;
 export {};

package/dist/types/index.d.ts

@@ -29,6 +29,7 @@ export { AddIcon } from './ui/icons/AddIcon';
 export { AppsIcon } from './ui/icons/AppsIcon';
 export { BoldIcon } from './ui/icons/BoldIcon';
 export { CommentIcon } from './ui/icons/CommentIcon';
+export { DefineIcon } from './ui/icons/DefineIcon';
 export { HeadingFiveIcon } from './ui/icons/HeadingFiveIcon';
 export { HeadingFourIcon } from './ui/icons/HeadingFourIcon';
 export { HeadingOneIcon } from './ui/icons/HeadingOneIcon';
@@ -67,6 +68,7 @@ export { UndoIcon } from './ui/icons/UndoIcon';
 export { RedoIcon } from './ui/icons/RedoIcon';
 export { HistoryIcon } from './ui/icons/HistoryIcon';
 export { LoomIcon } from './ui/icons/LoomIcon';
+export { PlusIcon } from './ui/icons/PlusIcon';
 export { default as ColorPalette } from './ui/ColorPalette';
 export { getContrastingBackgroundColor } from './ui/ColorPalette/utils';
 export type { IconComponent } from './types';

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

@@ -1,5 +1,6 @@
 import React, { type ReactNode } from 'react';
 import type { ResponsiveContainerProps } from './ResponsiveContainer';
+import { type ViewEventEmitterProps } from './ViewEventEmitter';
 type ToolbarProps = {
     children?: ReactNode;
     /**
@@ -8,13 +9,13 @@ type ToolbarProps = {
      * use case: query select the toolbar to position floating toolbar
      */
     label: string;
-};
+} & ViewEventEmitterProps;
 /**
  * A simple component representing a toolbar with box shadows - used to represent a secondary/floating toolbar
  *
  * @note: Responsiveness support replies on container query with container editor-area and media query
  */
-export declare const Toolbar: ({ children, label }: ToolbarProps) => React.JSX.Element;
+export declare const Toolbar: ({ children, label, actionSubjectId }: ToolbarProps) => React.JSX.Element;
 type PrimaryToolbarProps = ToolbarProps & ResponsiveContainerProps;
 /**
  *  A simple component representing a toolbar without box shadows - used to represent a primary toolbar

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

@@ -4,6 +4,7 @@ type ToolbarButtonProps = Partial<TriggerProps> & {
     ariaKeyshortcuts?: string;
     children?: ReactNode;
     iconBefore: React.ReactNode;
+    interactionName?: string;
     isDisabled?: boolean;
     isSelected?: boolean;
     label?: string;

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

@@ -18,10 +18,11 @@ type ToolbarDropdownItemProps = {
     isSelected?: boolean;
     onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;
     rel?: string;
+    shouldTitleWrap?: boolean;
     target?: string;
     testId?: string;
     textStyle?: TextStyle;
     triggerRef?: Ref<HTMLButtonElement>;
 };
-export declare const ToolbarDropdownItem: ({ onClick, elemBefore, elemAfter, isSelected, children, isDisabled, hasNestedDropdownMenu, triggerRef, testId, ariaKeyshortcuts, href, target, rel, }: ToolbarDropdownItemProps) => React.JSX.Element;
+export declare const ToolbarDropdownItem: ({ onClick, elemBefore, elemAfter, isSelected, children, isDisabled, hasNestedDropdownMenu, triggerRef, shouldTitleWrap, testId, ariaKeyshortcuts, href, target, rel, }: ToolbarDropdownItemProps) => React.JSX.Element;
 export {};

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

@@ -2,7 +2,8 @@ import React, { type ReactNode } from 'react';
 type ToolbarDropdownItemSectionProps = {
     children?: ReactNode;
     hasSeparator?: boolean;
+    testId?: string;
     title?: string;
 };
-export declare const ToolbarDropdownItemSection: ({ children, hasSeparator, title, }: ToolbarDropdownItemSectionProps) => React.JSX.Element;
+export declare const ToolbarDropdownItemSection: ({ children, hasSeparator, title, testId, }: ToolbarDropdownItemSectionProps) => React.JSX.Element;
 export {};

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

@@ -16,7 +16,7 @@ type ToolbarDropdownMenuProps = {
     iconBefore: React.ReactNode;
     isDisabled?: boolean;
     label?: string;
-    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onClick?: (event: React.MouseEvent<HTMLButtonElement>, isOpen: boolean) => void;
     testId?: string;
 };
 export declare const ToolbarDropdownMenu: ({ iconBefore, children, isDisabled, testId, label, hasSectionMargin, enableMaxHeight, onClick, }: ToolbarDropdownMenuProps) => JSX.Element;

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

@@ -12,8 +12,9 @@ type ToolbarNestedDropdownMenuProps = {
      */
     enableMaxHeight?: boolean;
     isDisabled?: boolean;
+    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;
     testId?: string;
     text?: string;
 };
-export declare const ToolbarNestedDropdownMenu: ({ elemBefore, text, elemAfter, children, isDisabled, testId, enableMaxHeight, }: ToolbarNestedDropdownMenuProps) => JSX.Element;
+export declare const ToolbarNestedDropdownMenu: ({ elemBefore, text, elemAfter, children, isDisabled, testId, enableMaxHeight, onClick, }: ToolbarNestedDropdownMenuProps) => JSX.Element;
 export {};

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

@@ -3,7 +3,8 @@ import type { PositionType } from '@atlaskit/tooltip';
 type ToolbarTooltipProps = {
     children: React.ReactNode;
     content: React.ReactNode;
+    delay?: number;
     position?: PositionType;
 };
-export declare const ToolbarTooltip: ({ content, children, position }: ToolbarTooltipProps) => React.JSX.Element;
+export declare const ToolbarTooltip: ({ content, children, position, delay, }: ToolbarTooltipProps) => React.JSX.Element;
 export {};

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

@@ -0,0 +1,12 @@
+export declare const ACTION_SUBJECT: {
+    TOOLBAR: string;
+    TOOLBAR_DROPDOWN_MENU: string;
+};
+export type ViewEventEmitterProps = {
+    actionSubject?: string;
+    /**
+     * Name of dropdown to identify in analytic events
+     */
+    actionSubjectId?: string;
+};
+export declare const ViewEventEmitter: ({ actionSubjectId, actionSubject }: ViewEventEmitterProps) => null;

package/dist/types/ui/icons/DefineIcon.d.ts

@@ -0,0 +1 @@
+export { default as DefineIcon } from '@atlaskit/icon/core/information-circle';

package/dist/types/ui/icons/PlusIcon.d.ts

@@ -0,0 +1 @@
+export { default as PlusIcon } from '@atlaskit/icon/core/plus-square';

package/dist/types-ts4.5/hooks/ui-context.d.ts

@@ -1,6 +1,14 @@
 import React from 'react';
 import type { OnOpenChangeArgs } from '@atlaskit/dropdown-menu';
+type AnalyticsEventPayload = {
+    action: string;
+    actionSubject?: string;
+    actionSubjectId?: string;
+    eventType: string;
+};
+type FireAnalyticsEvent = (payload: AnalyticsEventPayload) => void | undefined;
 export type ToolbarUIContextType = {
+    fireAnalyticsEvent?: FireAnalyticsEvent;
     /**
      * Indicates whether the toolbar is disabled when the editor is offline.
      */
@@ -26,5 +34,5 @@ export declare const useToolbarUI: () => ToolbarUIContextType;
 type ToolbarUIProviderProps = {
     children: React.ReactNode;
 } & ToolbarUIContextType;
-export declare const ToolbarUIProvider: ({ children, onDropdownOpenChanged, preventDefaultOnMouseDown, isDisabled, popupsMountPoint, popupsBoundariesElement, popupsScrollableElement, }: ToolbarUIProviderProps) => React.JSX.Element;
+export declare const ToolbarUIProvider: ({ children, onDropdownOpenChanged, preventDefaultOnMouseDown, isDisabled, popupsMountPoint, popupsBoundariesElement, popupsScrollableElement, fireAnalyticsEvent, }: ToolbarUIProviderProps) => React.JSX.Element;
 export {};

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

@@ -29,6 +29,7 @@ export { AddIcon } from './ui/icons/AddIcon';
 export { AppsIcon } from './ui/icons/AppsIcon';
 export { BoldIcon } from './ui/icons/BoldIcon';
 export { CommentIcon } from './ui/icons/CommentIcon';
+export { DefineIcon } from './ui/icons/DefineIcon';
 export { HeadingFiveIcon } from './ui/icons/HeadingFiveIcon';
 export { HeadingFourIcon } from './ui/icons/HeadingFourIcon';
 export { HeadingOneIcon } from './ui/icons/HeadingOneIcon';
@@ -67,6 +68,7 @@ export { UndoIcon } from './ui/icons/UndoIcon';
 export { RedoIcon } from './ui/icons/RedoIcon';
 export { HistoryIcon } from './ui/icons/HistoryIcon';
 export { LoomIcon } from './ui/icons/LoomIcon';
+export { PlusIcon } from './ui/icons/PlusIcon';
 export { default as ColorPalette } from './ui/ColorPalette';
 export { getContrastingBackgroundColor } from './ui/ColorPalette/utils';
 export type { IconComponent } from './types';

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

@@ -1,5 +1,6 @@
 import React, { type ReactNode } from 'react';
 import type { ResponsiveContainerProps } from './ResponsiveContainer';
+import { type ViewEventEmitterProps } from './ViewEventEmitter';
 type ToolbarProps = {
     children?: ReactNode;
     /**
@@ -8,13 +9,13 @@ type ToolbarProps = {
      * use case: query select the toolbar to position floating toolbar
      */
     label: string;
-};
+} & ViewEventEmitterProps;
 /**
  * A simple component representing a toolbar with box shadows - used to represent a secondary/floating toolbar
  *
  * @note: Responsiveness support replies on container query with container editor-area and media query
  */
-export declare const Toolbar: ({ children, label }: ToolbarProps) => React.JSX.Element;
+export declare const Toolbar: ({ children, label, actionSubjectId }: ToolbarProps) => React.JSX.Element;
 type PrimaryToolbarProps = ToolbarProps & ResponsiveContainerProps;
 /**
  *  A simple component representing a toolbar without box shadows - used to represent a primary toolbar

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

@@ -4,6 +4,7 @@ type ToolbarButtonProps = Partial<TriggerProps> & {
     ariaKeyshortcuts?: string;
     children?: ReactNode;
     iconBefore: React.ReactNode;
+    interactionName?: string;
     isDisabled?: boolean;
     isSelected?: boolean;
     label?: string;

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

@@ -18,10 +18,11 @@ type ToolbarDropdownItemProps = {
     isSelected?: boolean;
     onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;
     rel?: string;
+    shouldTitleWrap?: boolean;
     target?: string;
     testId?: string;
     textStyle?: TextStyle;
     triggerRef?: Ref<HTMLButtonElement>;
 };
-export declare const ToolbarDropdownItem: ({ onClick, elemBefore, elemAfter, isSelected, children, isDisabled, hasNestedDropdownMenu, triggerRef, testId, ariaKeyshortcuts, href, target, rel, }: ToolbarDropdownItemProps) => React.JSX.Element;
+export declare const ToolbarDropdownItem: ({ onClick, elemBefore, elemAfter, isSelected, children, isDisabled, hasNestedDropdownMenu, triggerRef, shouldTitleWrap, testId, ariaKeyshortcuts, href, target, rel, }: ToolbarDropdownItemProps) => React.JSX.Element;
 export {};

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

@@ -2,7 +2,8 @@ import React, { type ReactNode } from 'react';
 type ToolbarDropdownItemSectionProps = {
     children?: ReactNode;
     hasSeparator?: boolean;
+    testId?: string;
     title?: string;
 };
-export declare const ToolbarDropdownItemSection: ({ children, hasSeparator, title, }: ToolbarDropdownItemSectionProps) => React.JSX.Element;
+export declare const ToolbarDropdownItemSection: ({ children, hasSeparator, title, testId, }: ToolbarDropdownItemSectionProps) => React.JSX.Element;
 export {};

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

@@ -16,7 +16,7 @@ type ToolbarDropdownMenuProps = {
     iconBefore: React.ReactNode;
     isDisabled?: boolean;
     label?: string;
-    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onClick?: (event: React.MouseEvent<HTMLButtonElement>, isOpen: boolean) => void;
     testId?: string;
 };
 export declare const ToolbarDropdownMenu: ({ iconBefore, children, isDisabled, testId, label, hasSectionMargin, enableMaxHeight, onClick, }: ToolbarDropdownMenuProps) => JSX.Element;

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

@@ -12,8 +12,9 @@ type ToolbarNestedDropdownMenuProps = {
      */
     enableMaxHeight?: boolean;
     isDisabled?: boolean;
+    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;
     testId?: string;
     text?: string;
 };
-export declare const ToolbarNestedDropdownMenu: ({ elemBefore, text, elemAfter, children, isDisabled, testId, enableMaxHeight, }: ToolbarNestedDropdownMenuProps) => JSX.Element;
+export declare const ToolbarNestedDropdownMenu: ({ elemBefore, text, elemAfter, children, isDisabled, testId, enableMaxHeight, onClick, }: ToolbarNestedDropdownMenuProps) => JSX.Element;
 export {};

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

@@ -3,7 +3,8 @@ import type { PositionType } from '@atlaskit/tooltip';
 type ToolbarTooltipProps = {
     children: React.ReactNode;
     content: React.ReactNode;
+    delay?: number;
     position?: PositionType;
 };
-export declare const ToolbarTooltip: ({ content, children, position }: ToolbarTooltipProps) => React.JSX.Element;
+export declare const ToolbarTooltip: ({ content, children, position, delay, }: ToolbarTooltipProps) => React.JSX.Element;
 export {};

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

@@ -0,0 +1,12 @@
+export declare const ACTION_SUBJECT: {
+    TOOLBAR: string;
+    TOOLBAR_DROPDOWN_MENU: string;
+};
+export type ViewEventEmitterProps = {
+    actionSubject?: string;
+    /**
+     * Name of dropdown to identify in analytic events
+     */
+    actionSubjectId?: string;
+};
+export declare const ViewEventEmitter: ({ actionSubjectId, actionSubject }: ViewEventEmitterProps) => null;

package/dist/types-ts4.5/ui/icons/DefineIcon.d.ts

@@ -0,0 +1 @@
+export { default as DefineIcon } from '@atlaskit/icon/core/information-circle';

package/dist/types-ts4.5/ui/icons/PlusIcon.d.ts

@@ -0,0 +1 @@
+export { default as PlusIcon } from '@atlaskit/icon/core/plus-square';

package/package.json

@@ -3,7 +3,7 @@
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
 	},
-	"version": "0.8.6",
+	"version": "0.9.0",
 	"description": "Common UI for Toolbars across the platform",
 	"atlassian": {
 		"team": "Editor: Jenga",
@@ -31,7 +31,7 @@
 		"@atlaskit/platform-feature-flags-react": "^0.3.0",
 		"@atlaskit/popup": "^4.3.0",
 		"@atlaskit/primitives": "^14.14.0",
-		"@atlaskit/tmp-editor-statsig": "^12.14.0",
+		"@atlaskit/tmp-editor-statsig": "^12.21.0",
 		"@atlaskit/tokens": "^6.3.0",
 		"@atlaskit/tooltip": "^20.4.0",
 		"@babel/runtime": "^7.0.0",