@atlaskit/editor-plugin-card 5.0.5 → 5.0.6

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-card
 
+## 5.0.6
+
+### Patch Changes
+
+- [#120575](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/120575)
+  [`0da64a47689b5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0da64a47689b5) -
+  [ux] Add overflow menu on editor floating toolbar for media and card plugin
+
 ## 5.0.5
 
 ### Patch Changes

package/dist/cjs/ui/toolbar.js

@@ -19,6 +19,7 @@ var _utils = require("@atlaskit/editor-common/utils");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _comment = _interopRequireDefault(require("@atlaskit/icon/core/comment"));
+var _copy = _interopRequireDefault(require("@atlaskit/icon/core/copy"));
 var _delete = _interopRequireDefault(require("@atlaskit/icon/core/delete"));
 var _linkBroken = _interopRequireDefault(require("@atlaskit/icon/core/link-broken"));
 var _linkExternal = _interopRequireDefault(require("@atlaskit/icon/core/link-external"));
@@ -332,21 +333,6 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         onClick: withToolbarMetadata(removeCard(editorAnalyticsApi))
       }]) : [].concat(editItems, (0, _toConsumableArray2.default)(getUnlinkButtonGroup(state, intl, node, inlineCard, editorAnalyticsApi)), [getSettingsButton(intl, editorAnalyticsApi, cardOptions.userPreferencesLink), {
         type: 'separator'
-      }, {
-        id: 'editor.link.delete',
-        focusEditoronEnter: true,
-        type: 'button',
-        appearance: 'danger',
-        icon: _delete.default,
-        iconFallback: _remove.default,
-        onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, true),
-        onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, false),
-        onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, true),
-        onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, false),
-        title: intl.formatMessage(_messages.default.remove),
-        onClick: withToolbarMetadata(removeCard(editorAnalyticsApi))
-      }, {
-        type: 'separator'
       }, {
         id: 'editor.link.openLink',
         type: 'button',
@@ -356,15 +342,6 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         className: 'hyperlink-open-link',
         title: intl.formatMessage(_messages.linkMessages.openLink),
         onClick: visitCardLink(editorAnalyticsApi)
-      }, {
-        type: 'separator'
-      }, {
-        type: 'copy-button',
-        items: [{
-          state: state,
-          formatMessage: intl.formatMessage,
-          nodeType: node.type
-        }]
       }], (0, _toConsumableArray2.default)(commentItems.length > 1 ? [{
         type: 'separator'
       }, commentItems[0]] : commentItems));
@@ -420,6 +397,31 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
           type: 'separator'
         }]));
       }
+      if (toolbarItems.length > 0 && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
+        var overflowMenuConfig = [{
+          type: 'separator',
+          supportsViewMode: true
+        }, {
+          type: 'overflow-dropdown',
+          options: [{
+            title: 'Copy',
+            onClick: function onClick() {
+              // TODO replace with copy-button plugin
+              return true;
+            },
+            icon: /*#__PURE__*/_react.default.createElement(_copy.default, {
+              label: "Copy"
+            })
+          }, {
+            title: 'Delete',
+            onClick: withToolbarMetadata(removeCard(editorAnalyticsApi)),
+            icon: /*#__PURE__*/_react.default.createElement(_delete.default, {
+              label: "Delete"
+            })
+          }]
+        }];
+        toolbarItems.push.apply(toolbarItems, overflowMenuConfig);
+      }
       return toolbarItems;
     }
   };

package/dist/es2019/ui/toolbar.js

@@ -9,6 +9,7 @@ import { canRenderDatasource } from '@atlaskit/editor-common/utils';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { findDomRefAtPos, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
 import CommentIcon from '@atlaskit/icon/core/comment';
+import CopyIcon from '@atlaskit/icon/core/copy';
 import DeleteIcon from '@atlaskit/icon/core/delete';
 import LinkBrokenIcon from '@atlaskit/icon/core/link-broken';
 import LinkExternalIcon from '@atlaskit/icon/core/link-external';
@@ -324,21 +325,6 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, lpLinkP
       onClick: withToolbarMetadata(removeCard(editorAnalyticsApi))
     }] : [...editItems, ...getUnlinkButtonGroup(state, intl, node, inlineCard, editorAnalyticsApi), getSettingsButton(intl, editorAnalyticsApi, cardOptions.userPreferencesLink), {
       type: 'separator'
-    }, {
-      id: 'editor.link.delete',
-      focusEditoronEnter: true,
-      type: 'button',
-      appearance: 'danger',
-      icon: DeleteIcon,
-      iconFallback: RemoveIcon,
-      onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, true),
-      onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, false),
-      onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, true),
-      onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, false),
-      title: intl.formatMessage(commonMessages.remove),
-      onClick: withToolbarMetadata(removeCard(editorAnalyticsApi))
-    }, {
-      type: 'separator'
     }, {
       id: 'editor.link.openLink',
       type: 'button',
@@ -348,15 +334,6 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, lpLinkP
       className: 'hyperlink-open-link',
       title: intl.formatMessage(linkMessages.openLink),
       onClick: visitCardLink(editorAnalyticsApi)
-    }, {
-      type: 'separator'
-    }, {
-      type: 'copy-button',
-      items: [{
-        state,
-        formatMessage: intl.formatMessage,
-        nodeType: node.type
-      }]
     }, ...(commentItems.length > 1 ? [{
       type: 'separator'
     }, commentItems[0]] : commentItems)];
@@ -410,6 +387,31 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, lpLinkP
         type: 'separator'
       });
     }
+    if (toolbarItems.length > 0 && editorExperiment('platform_editor_controls', 'variant1')) {
+      const overflowMenuConfig = [{
+        type: 'separator',
+        supportsViewMode: true
+      }, {
+        type: 'overflow-dropdown',
+        options: [{
+          title: 'Copy',
+          onClick: () => {
+            // TODO replace with copy-button plugin
+            return true;
+          },
+          icon: /*#__PURE__*/React.createElement(CopyIcon, {
+            label: "Copy"
+          })
+        }, {
+          title: 'Delete',
+          onClick: withToolbarMetadata(removeCard(editorAnalyticsApi)),
+          icon: /*#__PURE__*/React.createElement(DeleteIcon, {
+            label: "Delete"
+          })
+        }]
+      }];
+      toolbarItems.push(...overflowMenuConfig);
+    }
     return toolbarItems;
   }
 };

package/dist/esm/ui/toolbar.js

@@ -13,6 +13,7 @@ import { canRenderDatasource } from '@atlaskit/editor-common/utils';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { findDomRefAtPos, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
 import CommentIcon from '@atlaskit/icon/core/comment';
+import CopyIcon from '@atlaskit/icon/core/copy';
 import DeleteIcon from '@atlaskit/icon/core/delete';
 import LinkBrokenIcon from '@atlaskit/icon/core/link-broken';
 import LinkExternalIcon from '@atlaskit/icon/core/link-external';
@@ -322,21 +323,6 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         onClick: withToolbarMetadata(removeCard(editorAnalyticsApi))
       }]) : [].concat(editItems, _toConsumableArray(getUnlinkButtonGroup(state, intl, node, inlineCard, editorAnalyticsApi)), [getSettingsButton(intl, editorAnalyticsApi, cardOptions.userPreferencesLink), {
         type: 'separator'
-      }, {
-        id: 'editor.link.delete',
-        focusEditoronEnter: true,
-        type: 'button',
-        appearance: 'danger',
-        icon: DeleteIcon,
-        iconFallback: RemoveIcon,
-        onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, true),
-        onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, false),
-        onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, true),
-        onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(node.type, false),
-        title: intl.formatMessage(commonMessages.remove),
-        onClick: withToolbarMetadata(removeCard(editorAnalyticsApi))
-      }, {
-        type: 'separator'
       }, {
         id: 'editor.link.openLink',
         type: 'button',
@@ -346,15 +332,6 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         className: 'hyperlink-open-link',
         title: intl.formatMessage(linkMessages.openLink),
         onClick: visitCardLink(editorAnalyticsApi)
-      }, {
-        type: 'separator'
-      }, {
-        type: 'copy-button',
-        items: [{
-          state: state,
-          formatMessage: intl.formatMessage,
-          nodeType: node.type
-        }]
       }], _toConsumableArray(commentItems.length > 1 ? [{
         type: 'separator'
       }, commentItems[0]] : commentItems));
@@ -410,6 +387,31 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
           type: 'separator'
         }]));
       }
+      if (toolbarItems.length > 0 && editorExperiment('platform_editor_controls', 'variant1')) {
+        var overflowMenuConfig = [{
+          type: 'separator',
+          supportsViewMode: true
+        }, {
+          type: 'overflow-dropdown',
+          options: [{
+            title: 'Copy',
+            onClick: function onClick() {
+              // TODO replace with copy-button plugin
+              return true;
+            },
+            icon: /*#__PURE__*/React.createElement(CopyIcon, {
+              label: "Copy"
+            })
+          }, {
+            title: 'Delete',
+            onClick: withToolbarMetadata(removeCard(editorAnalyticsApi)),
+            icon: /*#__PURE__*/React.createElement(DeleteIcon, {
+              label: "Delete"
+            })
+          }]
+        }];
+        toolbarItems.push.apply(toolbarItems, overflowMenuConfig);
+      }
       return toolbarItems;
     }
   };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-card",
-	"version": "5.0.5",
+	"version": "5.0.6",
 	"description": "Card plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",