@atlaskit/editor-plugin-floating-toolbar 1.12.0 → 1.12.2

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-plugin-floating-toolbar
 
+## 1.12.2
+
+### Patch Changes
+
+- [#137865](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/137865)
+  [`d392fecac5384`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d392fecac5384) -
+  [EDF-1247] Added beta label to proactive ai experience, patched editor floating toolbar to support
+  a new footer component if parsed in
+
+## 1.12.1
+
+### Patch Changes
+
+- [`1269ffa635367`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1269ffa635367) -
+  Cleanup FF platform_editor_get_card_provider_from_config
+
 ## 1.12.0
 
 ### Minor Changes

package/dist/cjs/ui/Divider.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Divider = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _primitives = require("@atlaskit/primitives");
+var styles = (0, _primitives.xcss)({
+  width: '100%',
+  borderBlockEnd: 'none',
+  borderBlockStart: "1px solid ".concat("var(--ds-border, #091E4224)"),
+  borderInline: 'none'
+});
+var Divider = exports.Divider = function Divider() {
+  return /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    as: "hr",
+    xcss: styles
+  });
+};

package/dist/cjs/ui/Dropdown.js

@@ -18,6 +18,7 @@ var _react2 = require("@emotion/react");
 var _ui = require("@atlaskit/editor-common/ui");
 var _uiMenu = require("@atlaskit/editor-common/ui-menu");
 var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
+var _Divider = require("./Divider");
 var _DropdownMenu = _interopRequireWildcard(require("./DropdownMenu"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -27,6 +28,7 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx
+ * @jsxFrag
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
 var dropdownExpandContainer = (0, _react2.css)({
@@ -137,7 +139,8 @@ var Dropdown = exports.default = /*#__PURE__*/function (_Component) {
         buttonTestId = _this$props2.buttonTestId,
         dropdownWidth = _this$props2.dropdownWidth,
         dropdownListId = _this$props2.dropdownListId,
-        alignDropdownWithToolbar = _this$props2.alignDropdownWithToolbar;
+        alignDropdownWithToolbar = _this$props2.alignDropdownWithToolbar,
+        footer = _this$props2.footer;
       var trigger;
       if (icon) {
         var TriggerIcon = hideExpandIcon ? icon : (0, _react2.jsx)(CompositeIcon, {
@@ -179,26 +182,34 @@ var Dropdown = exports.default = /*#__PURE__*/function (_Component) {
       var fitTolerance = 10;
       var fitWidth = Array.isArray(options) ? dropdownWidth || _DropdownMenu.menuItemDimensions.width : options.width;
       var fitHeight = Array.isArray(options) ? options.length * _DropdownMenu.menuItemDimensions.height + _DropdownMenu.itemSpacing * 2 : options.height;
-      return (0, _react2.jsx)(_uiMenu.DropdownContainer, {
-        mountTo: mountPoint,
-        boundariesElement: boundariesElement,
-        scrollableElement: scrollableElement,
-        isOpen: isOpen,
-        handleClickOutside: this.hide,
-        handleEscapeKeydown: this.hideOnEsc,
-        onOpenChange: this.onOpenChanged,
-        fitWidth: fitWidth + fitTolerance,
-        fitHeight: fitHeight + fitTolerance,
-        trigger: trigger,
-        dropdownListId: dropdownListId,
-        alignDropdownWithParentElement: alignDropdownWithToolbar,
-        arrowKeyNavigationProviderOptions: {
-          type: _uiMenu.ArrowKeyNavigationType.MENU
-        }
-      }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
-        hide: this.hide,
-        dispatchCommand: dispatchCommand
-      }));
+      return (
+        /**
+         * At the moment footer diver is rendered along with footer, if it's provided
+         * This is to provide some level of consistency
+         * Refer to the PR for more details:
+         * https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo/pull-requests/137394/overview?commentId=8130003
+         */
+        (0, _react2.jsx)(_uiMenu.DropdownContainer, {
+          mountTo: mountPoint,
+          boundariesElement: boundariesElement,
+          scrollableElement: scrollableElement,
+          isOpen: isOpen,
+          handleClickOutside: this.hide,
+          handleEscapeKeydown: this.hideOnEsc,
+          onOpenChange: this.onOpenChanged,
+          fitWidth: fitWidth + fitTolerance,
+          fitHeight: fitHeight + fitTolerance,
+          trigger: trigger,
+          dropdownListId: dropdownListId,
+          alignDropdownWithParentElement: alignDropdownWithToolbar,
+          arrowKeyNavigationProviderOptions: {
+            type: _uiMenu.ArrowKeyNavigationType.MENU
+          }
+        }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
+          hide: this.hide,
+          dispatchCommand: dispatchCommand
+        }), footer && (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_Divider.Divider, null), footer))
+      );
     }
   }, {
     key: "componentDidUpdate",

package/dist/cjs/ui/Toolbar.js

@@ -182,7 +182,8 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
           setDisableParentScroll: scrollable ? setDisableScroll : undefined,
           dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && "".concat(item.id, "-dropdownList"),
           alignDropdownWithToolbar: items.length === 1,
-          onToggle: item.onToggle
+          onToggle: item.onToggle,
+          footer: item.footer
         });
       case 'select':
         if (item.selectType === 'list') {

package/dist/es2019/ui/Divider.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { Box, xcss } from '@atlaskit/primitives';
+const styles = xcss({
+  width: '100%',
+  borderBlockEnd: 'none',
+  borderBlockStart: `1px solid ${"var(--ds-border, #091E4224)"}`,
+  borderInline: 'none'
+});
+export const Divider = () => /*#__PURE__*/React.createElement(Box, {
+  as: "hr",
+  xcss: styles
+});

package/dist/es2019/ui/Dropdown.js

@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * @jsxFrag
  */
 
 import React, { Component } from 'react';
@@ -11,6 +12,7 @@ import { css, jsx } from '@emotion/react';
 import { FloatingToolbarButton as Button } from '@atlaskit/editor-common/ui';
 import { ArrowKeyNavigationType, DropdownContainer as UiDropdown } from '@atlaskit/editor-common/ui-menu';
 import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
+import { Divider } from './Divider';
 import DropdownMenu, { itemSpacing, menuItemDimensions } from './DropdownMenu';
 
 // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
@@ -115,7 +117,8 @@ export default class Dropdown extends Component {
       buttonTestId,
       dropdownWidth,
       dropdownListId,
-      alignDropdownWithToolbar
+      alignDropdownWithToolbar,
+      footer
     } = this.props;
     let trigger;
     if (icon) {
@@ -158,26 +161,34 @@ export default class Dropdown extends Component {
     const fitTolerance = 10;
     const fitWidth = Array.isArray(options) ? dropdownWidth || menuItemDimensions.width : options.width;
     const fitHeight = Array.isArray(options) ? options.length * menuItemDimensions.height + itemSpacing * 2 : options.height;
-    return jsx(UiDropdown, {
-      mountTo: mountPoint,
-      boundariesElement: boundariesElement,
-      scrollableElement: scrollableElement,
-      isOpen: isOpen,
-      handleClickOutside: this.hide,
-      handleEscapeKeydown: this.hideOnEsc,
-      onOpenChange: this.onOpenChanged,
-      fitWidth: fitWidth + fitTolerance,
-      fitHeight: fitHeight + fitTolerance,
-      trigger: trigger,
-      dropdownListId: dropdownListId,
-      alignDropdownWithParentElement: alignDropdownWithToolbar,
-      arrowKeyNavigationProviderOptions: {
-        type: ArrowKeyNavigationType.MENU
-      }
-    }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
-      hide: this.hide,
-      dispatchCommand
-    }));
+    return (
+      /**
+       * At the moment footer diver is rendered along with footer, if it's provided
+       * This is to provide some level of consistency
+       * Refer to the PR for more details:
+       * https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo/pull-requests/137394/overview?commentId=8130003
+       */
+      jsx(UiDropdown, {
+        mountTo: mountPoint,
+        boundariesElement: boundariesElement,
+        scrollableElement: scrollableElement,
+        isOpen: isOpen,
+        handleClickOutside: this.hide,
+        handleEscapeKeydown: this.hideOnEsc,
+        onOpenChange: this.onOpenChanged,
+        fitWidth: fitWidth + fitTolerance,
+        fitHeight: fitHeight + fitTolerance,
+        trigger: trigger,
+        dropdownListId: dropdownListId,
+        alignDropdownWithParentElement: alignDropdownWithToolbar,
+        arrowKeyNavigationProviderOptions: {
+          type: ArrowKeyNavigationType.MENU
+        }
+      }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
+        hide: this.hide,
+        dispatchCommand
+      }), footer && jsx(React.Fragment, null, jsx(Divider, null), footer))
+    );
   }
   componentDidUpdate(prevProps, prevState) {
     if (prevState.isOpen !== this.state.isOpen) {

package/dist/es2019/ui/Toolbar.js

@@ -158,7 +158,8 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
           setDisableParentScroll: scrollable ? setDisableScroll : undefined,
           dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && `${item.id}-dropdownList`,
           alignDropdownWithToolbar: items.length === 1,
-          onToggle: item.onToggle
+          onToggle: item.onToggle,
+          footer: item.footer
         });
       case 'select':
         if (item.selectType === 'list') {

package/dist/esm/ui/Divider.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { Box, xcss } from '@atlaskit/primitives';
+var styles = xcss({
+  width: '100%',
+  borderBlockEnd: 'none',
+  borderBlockStart: "1px solid ".concat("var(--ds-border, #091E4224)"),
+  borderInline: 'none'
+});
+export var Divider = function Divider() {
+  return /*#__PURE__*/React.createElement(Box, {
+    as: "hr",
+    xcss: styles
+  });
+};

package/dist/esm/ui/Dropdown.js

@@ -12,6 +12,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * @jsxFrag
  */
 
 import React, { Component } from 'react';
@@ -21,6 +22,7 @@ import { css, jsx } from '@emotion/react';
 import { FloatingToolbarButton as Button } from '@atlaskit/editor-common/ui';
 import { ArrowKeyNavigationType, DropdownContainer as UiDropdown } from '@atlaskit/editor-common/ui-menu';
 import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
+import { Divider } from './Divider';
 import DropdownMenu, { itemSpacing, menuItemDimensions } from './DropdownMenu';
 
 // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
@@ -132,7 +134,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
         buttonTestId = _this$props2.buttonTestId,
         dropdownWidth = _this$props2.dropdownWidth,
         dropdownListId = _this$props2.dropdownListId,
-        alignDropdownWithToolbar = _this$props2.alignDropdownWithToolbar;
+        alignDropdownWithToolbar = _this$props2.alignDropdownWithToolbar,
+        footer = _this$props2.footer;
       var trigger;
       if (icon) {
         var TriggerIcon = hideExpandIcon ? icon : jsx(CompositeIcon, {
@@ -174,26 +177,34 @@ var Dropdown = /*#__PURE__*/function (_Component) {
       var fitTolerance = 10;
       var fitWidth = Array.isArray(options) ? dropdownWidth || menuItemDimensions.width : options.width;
       var fitHeight = Array.isArray(options) ? options.length * menuItemDimensions.height + itemSpacing * 2 : options.height;
-      return jsx(UiDropdown, {
-        mountTo: mountPoint,
-        boundariesElement: boundariesElement,
-        scrollableElement: scrollableElement,
-        isOpen: isOpen,
-        handleClickOutside: this.hide,
-        handleEscapeKeydown: this.hideOnEsc,
-        onOpenChange: this.onOpenChanged,
-        fitWidth: fitWidth + fitTolerance,
-        fitHeight: fitHeight + fitTolerance,
-        trigger: trigger,
-        dropdownListId: dropdownListId,
-        alignDropdownWithParentElement: alignDropdownWithToolbar,
-        arrowKeyNavigationProviderOptions: {
-          type: ArrowKeyNavigationType.MENU
-        }
-      }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
-        hide: this.hide,
-        dispatchCommand: dispatchCommand
-      }));
+      return (
+        /**
+         * At the moment footer diver is rendered along with footer, if it's provided
+         * This is to provide some level of consistency
+         * Refer to the PR for more details:
+         * https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo/pull-requests/137394/overview?commentId=8130003
+         */
+        jsx(UiDropdown, {
+          mountTo: mountPoint,
+          boundariesElement: boundariesElement,
+          scrollableElement: scrollableElement,
+          isOpen: isOpen,
+          handleClickOutside: this.hide,
+          handleEscapeKeydown: this.hideOnEsc,
+          onOpenChange: this.onOpenChanged,
+          fitWidth: fitWidth + fitTolerance,
+          fitHeight: fitHeight + fitTolerance,
+          trigger: trigger,
+          dropdownListId: dropdownListId,
+          alignDropdownWithParentElement: alignDropdownWithToolbar,
+          arrowKeyNavigationProviderOptions: {
+            type: ArrowKeyNavigationType.MENU
+          }
+        }, Array.isArray(options) ? this.renderArrayOptions(options) : options.render({
+          hide: this.hide,
+          dispatchCommand: dispatchCommand
+        }), footer && jsx(React.Fragment, null, jsx(Divider, null), footer))
+      );
     }
   }, {
     key: "componentDidUpdate",

package/dist/esm/ui/Toolbar.js

@@ -175,7 +175,8 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
           setDisableParentScroll: scrollable ? setDisableScroll : undefined,
           dropdownListId: (item === null || item === void 0 ? void 0 : item.id) && "".concat(item.id, "-dropdownList"),
           alignDropdownWithToolbar: items.length === 1,
-          onToggle: item.onToggle
+          onToggle: item.onToggle,
+          footer: item.footer
         });
       case 'select':
         if (item.selectType === 'list') {

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Divider: () => JSX.Element;

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

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * @jsxFrag
  */
 import type { ReactElement } from 'react';
 import React, { Component } from 'react';
@@ -28,6 +29,7 @@ export interface Props {
     dropdownListId?: string;
     alignDropdownWithToolbar?: boolean;
     onToggle?: (state: EditorState, dispatch: CommandDispatch | undefined) => boolean;
+    footer?: React.ReactNode;
 }
 export interface State {
     isOpen: boolean;

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Divider: () => JSX.Element;

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

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * @jsxFrag
  */
 import type { ReactElement } from 'react';
 import React, { Component } from 'react';
@@ -28,6 +29,7 @@ export interface Props {
     dropdownListId?: string;
     alignDropdownWithToolbar?: boolean;
     onToggle?: (state: EditorState, dispatch: CommandDispatch | undefined) => boolean;
+    footer?: React.ReactNode;
 }
 export interface State {
     isOpen: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-floating-toolbar",
-	"version": "1.12.0",
+	"version": "1.12.2",
 	"description": "Floating toolbar plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -26,7 +26,7 @@
 		"@atlaskit/adf-utils": "^19.8.0",
 		"@atlaskit/button": "^20.1.0",
 		"@atlaskit/checkbox": "^14.0.0",
-		"@atlaskit/editor-common": "^88.11.0",
+		"@atlaskit/editor-common": "^88.13.0",
 		"@atlaskit/editor-palette": "1.6.0",
 		"@atlaskit/editor-plugin-block-controls": "^1.13.0",
 		"@atlaskit/editor-plugin-context-panel": "^1.3.0",