@atlaskit/editor-plugin-toolbar 0.0.1

package/CHANGELOG.md

@@ -0,0 +1,12 @@
+# @atlaskit/editor-plugin-toolbar
+
+## 0.0.1
+
+### Patch Changes
+
+- [#192090](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/192090)
+  [`d1a5fb90b8bfd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d1a5fb90b8bfd) -
+  Add editor-plugin-toolbar package, which stores toolbar components and provides an api to register
+  them, using editor-toolbar-model libary as state manager. This plugin also renders a new selection
+  toolbar based on the new components.
+- Updated dependencies

package/LICENSE.md

@@ -0,0 +1,11 @@
+Copyright 2019 Atlassian Pty Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in
+compliance with the License. You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under the License is
+distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+implied. See the License for the specific language governing permissions and limitations under the
+License.

package/README.md

@@ -0,0 +1 @@
+# Editor plugin toolbar

package/afm-cc/tsconfig.json

@@ -0,0 +1,36 @@
+{
+	"extends": "../../../../tsconfig.entry-points.confluence.json",
+	"compilerOptions": {
+		"target": "es5",
+		"composite": true,
+		"outDir": "../../../../../confluence/tsDist/@atlaskit__editor-plugin-toolbar",
+		"rootDir": "../"
+	},
+	"include": [
+		"../src/**/*.ts",
+		"../src/**/*.tsx"
+	],
+	"exclude": [
+		"../src/**/__tests__/*",
+		"../src/**/*.test.*",
+		"../src/**/test.*",
+		"../src/**/examples.*"
+	],
+	"references": [
+		{
+			"path": "../../editor-plugin-selection/afm-cc/tsconfig.json"
+		},
+		{
+			"path": "../../editor-plugin-user-intent/afm-cc/tsconfig.json"
+		},
+		{
+			"path": "../../editor-toolbar/afm-cc/tsconfig.json"
+		},
+		{
+			"path": "../../editor-toolbar-model/afm-cc/tsconfig.json"
+		},
+		{
+			"path": "../../editor-common/afm-cc/tsconfig.json"
+		}
+	]
+}

package/afm-jira/tsconfig.json

@@ -0,0 +1,30 @@
+{
+	"extends": "../../../../tsconfig.entry-points.jira.json",
+	"compilerOptions": {
+		"target": "es5",
+		"outDir": "../../../../../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": "../../editor-toolbar/afm-jira/tsconfig.json"
+		},
+		{
+			"path": "../../editor-toolbar-model/afm-jira/tsconfig.json"
+		},
+		{
+			"path": "../../editor-common/afm-jira/tsconfig.json"
+		}
+	]
+}

package/afm-post-office/tsconfig.json

@@ -0,0 +1,30 @@
+{
+	"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": "../../editor-toolbar/afm-post-office/tsconfig.json"
+		},
+		{
+			"path": "../../editor-toolbar-model/afm-post-office/tsconfig.json"
+		},
+		{
+			"path": "../../editor-common/afm-post-office/tsconfig.json"
+		}
+	]
+}

package/build/tsconfig.json

@@ -0,0 +1,17 @@
+{
+	"extends": "../tsconfig",
+	"compilerOptions": {
+		"target": "es5",
+		"paths": {}
+	},
+	"include": [
+		"../src/**/*.ts",
+		"../src/**/*.tsx"
+	],
+	"exclude": [
+		"../src/**/__tests__/*",
+		"../src/**/*.test.*",
+		"../src/**/test.*",
+		"../src/**/examples.*"
+	]
+}

package/dist/cjs/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "toolbarPlugin", {
+  enumerable: true,
+  get: function get() {
+    return _toolbarPlugin.toolbarPlugin;
+  }
+});
+var _toolbarPlugin = require("./toolbarPlugin");

package/dist/cjs/toolbarPlugin.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.toolbarPlugin = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _editorToolbarModel = require("@atlaskit/editor-toolbar-model");
+var _SelectionToolbar = require("./ui/SelectionToolbar");
+var _toolbarComponents = require("./ui/toolbar-components");
+var toolbarPlugin = exports.toolbarPlugin = function toolbarPlugin(_ref) {
+  var api = _ref.api;
+  var registry = (0, _editorToolbarModel.createComponentRegistry)();
+  registry.register((0, _toolbarComponents.getToolbarComponents)());
+  return {
+    name: 'toolbar',
+    actions: {
+      registerComponents: function registerComponents(toolbarComponents) {
+        registry.register(toolbarComponents);
+      },
+      getComponents: function getComponents() {
+        return registry.components;
+      }
+    },
+    contentComponent: function contentComponent(_ref2) {
+      var editorView = _ref2.editorView;
+      return /*#__PURE__*/_react.default.createElement(_SelectionToolbar.SelectionToolbar, {
+        api: api,
+        editorView: editorView
+      });
+    }
+  };
+};

package/dist/cjs/toolbarPluginType.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/ui/SelectionToolbar/index.js

@@ -0,0 +1,86 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SelectionToolbar = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _coreUtils = require("@atlaskit/editor-common/core-utils");
+var _ui = require("@atlaskit/editor-common/ui");
+var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
+var _utils = require("@atlaskit/editor-common/utils");
+var _state = require("@atlaskit/editor-prosemirror/state");
+var _utils2 = require("@atlaskit/editor-prosemirror/utils");
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _editorToolbarModel = require("@atlaskit/editor-toolbar-model");
+var _consts = require("../consts");
+var isToolbarComponent = function isToolbarComponent(component) {
+  return component.type === 'toolbar' && component.key === 'inline-text-toolbar';
+};
+var SelectionToolbar = exports.SelectionToolbar = function SelectionToolbar(_ref) {
+  var api = _ref.api,
+    editorView = _ref.editorView;
+  var components = api === null || api === void 0 ? void 0 : api.toolbar.actions.getComponents();
+  var toolbar = components === null || components === void 0 ? void 0 : components.find(function (component) {
+    return isToolbarComponent(component);
+  });
+  var currentUserIntent = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'userIntent.currentUserIntent');
+  // TODO: ED-28735 - figure out a better way to control this - needed to re-render on selection change
+  // @ts-expect-error
+  var selection = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'selection.selection');
+  var isTextSelection = !editorView.state.selection.empty && editorView.state.selection instanceof _state.TextSelection;
+  if (!components || !toolbar) {
+    return null;
+  }
+  if (!isTextSelection || currentUserIntent === 'dragging' || (0, _coreUtils.isSSR)()) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement(_ui.Popup, {
+    offset: [0, 10],
+    target: getDomRefFromSelection(editorView),
+    onPositionCalculated: function onPositionCalculated(position) {
+      return (0, _utils.calculateToolbarPositionTrackHead)(_consts.TOOLBAR_LABEL)(editorView, position);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_editorToolbarModel.ToolbarModelRenderer, {
+    toolbar: toolbar,
+    components: components,
+    fallbacks: {
+      section: _editorToolbar.ToolbarSection,
+      menuSection: _editorToolbar.ToolbarDropdownItemSection,
+      group: _editorToolbar.ToolbarButtonGroup
+    }
+  }));
+};
+var getDomRefFromSelection = function getDomRefFromSelection(view
+// dispatchAnalyticsEvent?: DispatchAnalyticsEvent,
+) {
+  try {
+    // Ignored via go/ees005
+    // eslint-disable-next-line @atlaskit/editor/no-as-casting
+    return (0, _utils2.findDomRefAtPos)(view.state.selection.from, view.domAtPos.bind(view));
+    // Ignored via go/ees005
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  } catch (error) {
+    // // eslint-disable-next-line no-console
+    // console.warn(error);
+    // if (dispatchAnalyticsEvent) {
+    // 	const payload: AnalyticsEventPayload = {
+    // 		action: ACTION.ERRORED,
+    // 		actionSubject: ACTION_SUBJECT.CONTENT_COMPONENT,
+    // 		eventType: EVENT_TYPE.OPERATIONAL,
+    // 		attributes: {
+    // 			component: CONTENT_COMPONENT.FLOATING_TOOLBAR,
+    // 			selection: view.state.selection.toJSON(),
+    // 			position: view.state.selection.from,
+    // 			docSize: view.state.doc.nodeSize,
+    // 			error: error.toString(),
+    // 			// @ts-expect-error - Object literal may only specify known properties, 'errorStack' does not exist in type
+    // 			// This error was introduced after upgrading to TypeScript 5
+    // 			errorStack: error.stack || undefined,
+    // 		},
+    // 	};
+    // 	dispatchAnalyticsEvent(payload);
+    // }
+  }
+};

package/dist/cjs/ui/consts.js

@@ -0,0 +1,7 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TOOLBAR_LABEL = void 0;
+var TOOLBAR_LABEL = exports.TOOLBAR_LABEL = 'Editor Toolbar';

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

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getToolbarComponents = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _consts = require("./consts");
+var getToolbarComponents = exports.getToolbarComponents = function getToolbarComponents() {
+  return [{
+    type: 'toolbar',
+    key: 'inline-text-toolbar',
+    component: function component(_ref) {
+      var children = _ref.children;
+      return /*#__PURE__*/_react.default.createElement(_editorToolbar.Toolbar, {
+        label: _consts.TOOLBAR_LABEL
+      }, children);
+    }
+  },
+  // TODO: ED-28684 - clean up AI code and move to AI package
+  {
+    type: 'section',
+    key: 'ai-section',
+    parents: [{
+      type: 'toolbar',
+      key: 'inline-text-toolbar',
+      rank: 100
+    }]
+  }, {
+    type: 'group',
+    key: 'ai-group',
+    parents: [{
+      type: 'section',
+      key: 'ai-section',
+      rank: 100
+    }]
+  }, {
+    type: 'button',
+    key: 'ai-button',
+    parents: [{
+      type: 'group',
+      key: 'ai-group',
+      rank: 100
+    }],
+    component: function component(_ref2) {
+      var groupLocation = _ref2.groupLocation;
+      return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarButton, {
+        label: "AI",
+        icon: _editorToolbar.AIChatIcon,
+        groupLocation: groupLocation
+      }, "AI");
+    }
+  }];
+};

package/dist/es2019/index.js

@@ -0,0 +1,4 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+// Entry file in package.json
+
+export { toolbarPlugin } from './toolbarPlugin';

package/dist/es2019/toolbarPlugin.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { createComponentRegistry } from '@atlaskit/editor-toolbar-model';
+import { SelectionToolbar } from './ui/SelectionToolbar';
+import { getToolbarComponents } from './ui/toolbar-components';
+export const toolbarPlugin = ({
+  api
+}) => {
+  const registry = createComponentRegistry();
+  registry.register(getToolbarComponents());
+  return {
+    name: 'toolbar',
+    actions: {
+      registerComponents: toolbarComponents => {
+        registry.register(toolbarComponents);
+      },
+      getComponents: () => {
+        return registry.components;
+      }
+    },
+    contentComponent: ({
+      editorView
+    }) => {
+      return /*#__PURE__*/React.createElement(SelectionToolbar, {
+        api: api,
+        editorView: editorView
+      });
+    }
+  };
+};

package/dist/es2019/toolbarPluginType.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/ui/SelectionToolbar/index.js

@@ -0,0 +1,76 @@
+import React from 'react';
+import { isSSR } from '@atlaskit/editor-common/core-utils';
+import { Popup } from '@atlaskit/editor-common/ui';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { calculateToolbarPositionTrackHead } from '@atlaskit/editor-common/utils';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
+import { ToolbarSection, ToolbarButtonGroup, ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
+import { ToolbarModelRenderer } from '@atlaskit/editor-toolbar-model';
+import { TOOLBAR_LABEL } from '../consts';
+const isToolbarComponent = component => {
+  return component.type === 'toolbar' && component.key === 'inline-text-toolbar';
+};
+export const SelectionToolbar = ({
+  api,
+  editorView
+}) => {
+  const components = api === null || api === void 0 ? void 0 : api.toolbar.actions.getComponents();
+  const toolbar = components === null || components === void 0 ? void 0 : components.find(component => isToolbarComponent(component));
+  const currentUserIntent = useSharedPluginStateSelector(api, 'userIntent.currentUserIntent');
+  // TODO: ED-28735 - figure out a better way to control this - needed to re-render on selection change
+  // @ts-expect-error
+  const selection = useSharedPluginStateSelector(api, 'selection.selection');
+  const isTextSelection = !editorView.state.selection.empty && editorView.state.selection instanceof TextSelection;
+  if (!components || !toolbar) {
+    return null;
+  }
+  if (!isTextSelection || currentUserIntent === 'dragging' || isSSR()) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(Popup, {
+    offset: [0, 10],
+    target: getDomRefFromSelection(editorView),
+    onPositionCalculated: position => calculateToolbarPositionTrackHead(TOOLBAR_LABEL)(editorView, position)
+  }, /*#__PURE__*/React.createElement(ToolbarModelRenderer, {
+    toolbar: toolbar,
+    components: components,
+    fallbacks: {
+      section: ToolbarSection,
+      menuSection: ToolbarDropdownItemSection,
+      group: ToolbarButtonGroup
+    }
+  }));
+};
+const getDomRefFromSelection = (view
+// dispatchAnalyticsEvent?: DispatchAnalyticsEvent,
+) => {
+  try {
+    // Ignored via go/ees005
+    // eslint-disable-next-line @atlaskit/editor/no-as-casting
+    return findDomRefAtPos(view.state.selection.from, view.domAtPos.bind(view));
+    // Ignored via go/ees005
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  } catch (error) {
+    // // eslint-disable-next-line no-console
+    // console.warn(error);
+    // if (dispatchAnalyticsEvent) {
+    // 	const payload: AnalyticsEventPayload = {
+    // 		action: ACTION.ERRORED,
+    // 		actionSubject: ACTION_SUBJECT.CONTENT_COMPONENT,
+    // 		eventType: EVENT_TYPE.OPERATIONAL,
+    // 		attributes: {
+    // 			component: CONTENT_COMPONENT.FLOATING_TOOLBAR,
+    // 			selection: view.state.selection.toJSON(),
+    // 			position: view.state.selection.from,
+    // 			docSize: view.state.doc.nodeSize,
+    // 			error: error.toString(),
+    // 			// @ts-expect-error - Object literal may only specify known properties, 'errorStack' does not exist in type
+    // 			// This error was introduced after upgrading to TypeScript 5
+    // 			errorStack: error.stack || undefined,
+    // 		},
+    // 	};
+    // 	dispatchAnalyticsEvent(payload);
+    // }
+  }
+};

package/dist/es2019/ui/consts.js

@@ -0,0 +1 @@
+export const TOOLBAR_LABEL = 'Editor Toolbar';

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

@@ -0,0 +1,51 @@
+import React from 'react';
+import { AIChatIcon, Toolbar, ToolbarButton } from '@atlaskit/editor-toolbar';
+import { TOOLBAR_LABEL } from './consts';
+export const getToolbarComponents = () => {
+  return [{
+    type: 'toolbar',
+    key: 'inline-text-toolbar',
+    component: ({
+      children
+    }) => {
+      return /*#__PURE__*/React.createElement(Toolbar, {
+        label: TOOLBAR_LABEL
+      }, children);
+    }
+  },
+  // TODO: ED-28684 - clean up AI code and move to AI package
+  {
+    type: 'section',
+    key: 'ai-section',
+    parents: [{
+      type: 'toolbar',
+      key: 'inline-text-toolbar',
+      rank: 100
+    }]
+  }, {
+    type: 'group',
+    key: 'ai-group',
+    parents: [{
+      type: 'section',
+      key: 'ai-section',
+      rank: 100
+    }]
+  }, {
+    type: 'button',
+    key: 'ai-button',
+    parents: [{
+      type: 'group',
+      key: 'ai-group',
+      rank: 100
+    }],
+    component: ({
+      groupLocation
+    }) => {
+      return /*#__PURE__*/React.createElement(ToolbarButton, {
+        label: "AI",
+        icon: AIChatIcon,
+        groupLocation: groupLocation
+      }, "AI");
+    }
+  }];
+};

package/dist/esm/index.js

@@ -0,0 +1,4 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+// Entry file in package.json
+
+export { toolbarPlugin } from './toolbarPlugin';

package/dist/esm/toolbarPlugin.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createComponentRegistry } from '@atlaskit/editor-toolbar-model';
+import { SelectionToolbar } from './ui/SelectionToolbar';
+import { getToolbarComponents } from './ui/toolbar-components';
+export var toolbarPlugin = function toolbarPlugin(_ref) {
+  var api = _ref.api;
+  var registry = createComponentRegistry();
+  registry.register(getToolbarComponents());
+  return {
+    name: 'toolbar',
+    actions: {
+      registerComponents: function registerComponents(toolbarComponents) {
+        registry.register(toolbarComponents);
+      },
+      getComponents: function getComponents() {
+        return registry.components;
+      }
+    },
+    contentComponent: function contentComponent(_ref2) {
+      var editorView = _ref2.editorView;
+      return /*#__PURE__*/React.createElement(SelectionToolbar, {
+        api: api,
+        editorView: editorView
+      });
+    }
+  };
+};

package/dist/esm/toolbarPluginType.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/ui/SelectionToolbar/index.js

@@ -0,0 +1,79 @@
+import React from 'react';
+import { isSSR } from '@atlaskit/editor-common/core-utils';
+import { Popup } from '@atlaskit/editor-common/ui';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { calculateToolbarPositionTrackHead } from '@atlaskit/editor-common/utils';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
+import { ToolbarSection, ToolbarButtonGroup, ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
+import { ToolbarModelRenderer } from '@atlaskit/editor-toolbar-model';
+import { TOOLBAR_LABEL } from '../consts';
+var isToolbarComponent = function isToolbarComponent(component) {
+  return component.type === 'toolbar' && component.key === 'inline-text-toolbar';
+};
+export var SelectionToolbar = function SelectionToolbar(_ref) {
+  var api = _ref.api,
+    editorView = _ref.editorView;
+  var components = api === null || api === void 0 ? void 0 : api.toolbar.actions.getComponents();
+  var toolbar = components === null || components === void 0 ? void 0 : components.find(function (component) {
+    return isToolbarComponent(component);
+  });
+  var currentUserIntent = useSharedPluginStateSelector(api, 'userIntent.currentUserIntent');
+  // TODO: ED-28735 - figure out a better way to control this - needed to re-render on selection change
+  // @ts-expect-error
+  var selection = useSharedPluginStateSelector(api, 'selection.selection');
+  var isTextSelection = !editorView.state.selection.empty && editorView.state.selection instanceof TextSelection;
+  if (!components || !toolbar) {
+    return null;
+  }
+  if (!isTextSelection || currentUserIntent === 'dragging' || isSSR()) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(Popup, {
+    offset: [0, 10],
+    target: getDomRefFromSelection(editorView),
+    onPositionCalculated: function onPositionCalculated(position) {
+      return calculateToolbarPositionTrackHead(TOOLBAR_LABEL)(editorView, position);
+    }
+  }, /*#__PURE__*/React.createElement(ToolbarModelRenderer, {
+    toolbar: toolbar,
+    components: components,
+    fallbacks: {
+      section: ToolbarSection,
+      menuSection: ToolbarDropdownItemSection,
+      group: ToolbarButtonGroup
+    }
+  }));
+};
+var getDomRefFromSelection = function getDomRefFromSelection(view
+// dispatchAnalyticsEvent?: DispatchAnalyticsEvent,
+) {
+  try {
+    // Ignored via go/ees005
+    // eslint-disable-next-line @atlaskit/editor/no-as-casting
+    return findDomRefAtPos(view.state.selection.from, view.domAtPos.bind(view));
+    // Ignored via go/ees005
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  } catch (error) {
+    // // eslint-disable-next-line no-console
+    // console.warn(error);
+    // if (dispatchAnalyticsEvent) {
+    // 	const payload: AnalyticsEventPayload = {
+    // 		action: ACTION.ERRORED,
+    // 		actionSubject: ACTION_SUBJECT.CONTENT_COMPONENT,
+    // 		eventType: EVENT_TYPE.OPERATIONAL,
+    // 		attributes: {
+    // 			component: CONTENT_COMPONENT.FLOATING_TOOLBAR,
+    // 			selection: view.state.selection.toJSON(),
+    // 			position: view.state.selection.from,
+    // 			docSize: view.state.doc.nodeSize,
+    // 			error: error.toString(),
+    // 			// @ts-expect-error - Object literal may only specify known properties, 'errorStack' does not exist in type
+    // 			// This error was introduced after upgrading to TypeScript 5
+    // 			errorStack: error.stack || undefined,
+    // 		},
+    // 	};
+    // 	dispatchAnalyticsEvent(payload);
+    // }
+  }
+};

package/dist/esm/ui/consts.js

@@ -0,0 +1 @@
+export var TOOLBAR_LABEL = 'Editor Toolbar';

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

@@ -0,0 +1,49 @@
+import React from 'react';
+import { AIChatIcon, Toolbar, ToolbarButton } from '@atlaskit/editor-toolbar';
+import { TOOLBAR_LABEL } from './consts';
+export var getToolbarComponents = function getToolbarComponents() {
+  return [{
+    type: 'toolbar',
+    key: 'inline-text-toolbar',
+    component: function component(_ref) {
+      var children = _ref.children;
+      return /*#__PURE__*/React.createElement(Toolbar, {
+        label: TOOLBAR_LABEL
+      }, children);
+    }
+  },
+  // TODO: ED-28684 - clean up AI code and move to AI package
+  {
+    type: 'section',
+    key: 'ai-section',
+    parents: [{
+      type: 'toolbar',
+      key: 'inline-text-toolbar',
+      rank: 100
+    }]
+  }, {
+    type: 'group',
+    key: 'ai-group',
+    parents: [{
+      type: 'section',
+      key: 'ai-section',
+      rank: 100
+    }]
+  }, {
+    type: 'button',
+    key: 'ai-button',
+    parents: [{
+      type: 'group',
+      key: 'ai-group',
+      rank: 100
+    }],
+    component: function component(_ref2) {
+      var groupLocation = _ref2.groupLocation;
+      return /*#__PURE__*/React.createElement(ToolbarButton, {
+        label: "AI",
+        icon: AIChatIcon,
+        groupLocation: groupLocation
+      }, "AI");
+    }
+  }];
+};

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+export { toolbarPlugin } from './toolbarPlugin';
+export type { ToolbarPlugin } from './toolbarPluginType';

package/dist/types/toolbarPlugin.d.ts

@@ -0,0 +1,2 @@
+import type { ToolbarPlugin } from './toolbarPluginType';
+export declare const toolbarPlugin: ToolbarPlugin;

package/dist/types/toolbarPluginType.d.ts

@@ -0,0 +1,11 @@
+import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
+import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
+import type { RegisterComponent } from '@atlaskit/editor-toolbar-model';
+export type ToolbarPlugin = NextEditorPlugin<'toolbar', {
+    dependencies: [OptionalPlugin<UserIntentPlugin>, OptionalPlugin<SelectionPlugin>];
+    actions: {
+        registerComponents: (toolbarComponents: Array<RegisterComponent>) => void;
+        getComponents: () => Array<RegisterComponent>;
+    };
+}>;

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

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { ToolbarPlugin } from '../../toolbarPluginType';
+type SelectionToolbarProps = {
+    editorView: EditorView;
+    api?: ExtractInjectionAPI<ToolbarPlugin>;
+};
+export declare const SelectionToolbar: ({ api, editorView }: SelectionToolbarProps) => React.JSX.Element | null;
+export {};

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

@@ -0,0 +1 @@
+export declare const TOOLBAR_LABEL = "Editor Toolbar";

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

@@ -0,0 +1,2 @@
+import { type RegisterComponent } from '@atlaskit/editor-toolbar-model';
+export declare const getToolbarComponents: () => RegisterComponent[];

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

@@ -0,0 +1,2 @@
+export { toolbarPlugin } from './toolbarPlugin';
+export type { ToolbarPlugin } from './toolbarPluginType';

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

@@ -0,0 +1,2 @@
+import type { ToolbarPlugin } from './toolbarPluginType';
+export declare const toolbarPlugin: ToolbarPlugin;

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

@@ -0,0 +1,14 @@
+import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
+import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
+import type { RegisterComponent } from '@atlaskit/editor-toolbar-model';
+export type ToolbarPlugin = NextEditorPlugin<'toolbar', {
+    dependencies: [
+        OptionalPlugin<UserIntentPlugin>,
+        OptionalPlugin<SelectionPlugin>
+    ];
+    actions: {
+        registerComponents: (toolbarComponents: Array<RegisterComponent>) => void;
+        getComponents: () => Array<RegisterComponent>;
+    };
+}>;

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

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { ToolbarPlugin } from '../../toolbarPluginType';
+type SelectionToolbarProps = {
+    editorView: EditorView;
+    api?: ExtractInjectionAPI<ToolbarPlugin>;
+};
+export declare const SelectionToolbar: ({ api, editorView }: SelectionToolbarProps) => React.JSX.Element | null;
+export {};

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

@@ -0,0 +1 @@
+export declare const TOOLBAR_LABEL = "Editor Toolbar";

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

@@ -0,0 +1,2 @@
+import { type RegisterComponent } from '@atlaskit/editor-toolbar-model';
+export declare const getToolbarComponents: () => RegisterComponent[];

package/docs/0-intro.tsx

@@ -0,0 +1,43 @@
+import React from 'react';
+
+import { AtlassianInternalWarning, code, md } from '@atlaskit/docs';
+// eslint-disable-next-line @atlassian/tangerine/import/entry-points
+import { createEditorUseOnlyNotice } from '@atlaskit/editor-common/doc-utils';
+import { token } from '@atlaskit/tokens';
+
+export default md`
+
+${createEditorUseOnlyNotice('Editor Plugin Toolbar', [
+	{ name: 'Editor Core', link: '/packages/editor/editor-core' },
+])}
+
+
+  ${
+		(
+			// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+			<div style={{ marginTop: token('space.100', '8px') }}>
+				<AtlassianInternalWarning />
+			</div>
+		)
+	}
+
+  This package includes the toolbar plugin used by \`@atlaskit/editor-core\`.
+
+  ## Usage
+---
+
+The \`dependencies\`, \`configuration\`, \`state\`, \`actions\`, and \`commands\` of the plugin are defined
+below:
+
+${code`
+type ToolbarPlugin = NextEditorPlugin<'toolbar'>
+`}
+
+
+  ## Support
+---
+For internal Atlassian, visit the slack channel [#help-editor](https://atlassian.slack.com/archives/CFG3PSQ9E) for support or visit [go/editor-help](https://go/editor-help) to submit a bug.
+## License
+---
+ Please see [Atlassian Frontend - License](https://hello.atlassian.net/wiki/spaces/AF/pages/2589099144/Documentation#License) for more licensing information.
+`;

package/package.json

@@ -0,0 +1,84 @@
+{
+	"name": "@atlaskit/editor-plugin-toolbar",
+	"version": "0.0.1",
+	"description": "Toolbar plugin for @atlaskit/editor-core",
+	"author": "Atlassian Pty Ltd",
+	"license": "Apache-2.0",
+	"publishConfig": {
+		"registry": "https://registry.npmjs.org/"
+	},
+	"atlassian": {
+		"team": "Editor: Jenga",
+		"releaseModel": "continuous",
+		"singleton": true
+	},
+	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
+	"main": "dist/cjs/index.js",
+	"module": "dist/esm/index.js",
+	"module:es2019": "dist/es2019/index.js",
+	"types": "dist/types/index.d.ts",
+	"typesVersions": {
+		">=4.5 <4.9": {
+			"*": [
+				"dist/types-ts4.5/*",
+				"dist/types-ts4.5/index.d.ts"
+			]
+		}
+	},
+	"sideEffects": false,
+	"atlaskit:src": "src/index.ts",
+	"af:exports": {
+		".": "./src/index.ts"
+	},
+	"dependencies": {
+		"@atlaskit/editor-plugin-selection": "^3.0.0",
+		"@atlaskit/editor-plugin-user-intent": "^1.1.0",
+		"@atlaskit/editor-prosemirror": "7.0.0",
+		"@atlaskit/editor-toolbar": "^0.0.5",
+		"@atlaskit/editor-toolbar-model": "^0.0.1",
+		"@babel/runtime": "^7.0.0"
+	},
+	"peerDependencies": {
+		"@atlaskit/editor-common": "^107.14.0",
+		"react": "^18.2.0"
+	},
+	"devDependencies": {
+		"typescript": "~5.4.2"
+	},
+	"techstack": {
+		"@atlassian/frontend": {
+			"code-structure": [
+				"editor-plugin"
+			],
+			"import-structure": [
+				"atlassian-conventions"
+			],
+			"circular-dependencies": [
+				"file-and-folder-level"
+			]
+		},
+		"@repo/internal": {
+			"dom-events": "use-bind-event-listener",
+			"analytics": [
+				"analytics-next"
+			],
+			"design-tokens": [
+				"color"
+			],
+			"theming": [
+				"react-context"
+			],
+			"ui-components": [
+				"lite-mode"
+			],
+			"deprecation": "no-deprecated-imports",
+			"styling": [
+				"emotion",
+				"emotion"
+			],
+			"imports": [
+				"import-no-extraneous-disable-for-examples-and-docs"
+			]
+		}
+	}
+}

package/tsconfig.json

@@ -0,0 +1,8 @@
+{
+	"extends": "../../../tsconfig.json",
+	"include": [
+		"src/**/*.ts",
+		"src/**/*.tsx"
+	],
+	"compilerOptions": {}
+}