@atlaskit/editor-plugin-card 5.0.5 → 5.0.7

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-plugin-card
 
+## 5.0.7
+
+### Patch Changes
+
+- [#121092](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/121092)
+  [`8cd08b738070d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8cd08b738070d) -
+  [ux] Implemented full height separator as per design for media and 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"));
@@ -331,22 +332,8 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         title: intl.formatMessage(_messages.default.remove),
         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'
+        type: 'separator',
+        fullHeight: true
       }, {
         id: 'editor.link.openLink',
         type: 'button',
@@ -356,17 +343,9 @@ 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'
+        type: 'separator',
+        fullHeight: true
       }, commentItems[0]] : commentItems));
       if (currentAppearance === 'embed') {
         var _pluginInjectionApi$a4;
@@ -420,6 +399,32 @@ 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,
+          fullHeight: 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';
@@ -323,22 +324,8 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, lpLinkP
       title: intl.formatMessage(commonMessages.remove),
       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'
+      type: 'separator',
+      fullHeight: true
     }, {
       id: 'editor.link.openLink',
       type: 'button',
@@ -348,17 +335,9 @@ 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'
+      type: 'separator',
+      fullHeight: true
     }, commentItems[0]] : commentItems)];
     if (currentAppearance === 'embed') {
       var _pluginInjectionApi$a5;
@@ -410,6 +389,32 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, lpLinkP
         type: 'separator'
       });
     }
+    if (toolbarItems.length > 0 && editorExperiment('platform_editor_controls', 'variant1')) {
+      const overflowMenuConfig = [{
+        type: 'separator',
+        supportsViewMode: true,
+        fullHeight: 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';
@@ -321,22 +322,8 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         title: intl.formatMessage(commonMessages.remove),
         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'
+        type: 'separator',
+        fullHeight: true
       }, {
         id: 'editor.link.openLink',
         type: 'button',
@@ -346,17 +333,9 @@ 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'
+        type: 'separator',
+        fullHeight: true
       }, commentItems[0]] : commentItems));
       if (currentAppearance === 'embed') {
         var _pluginInjectionApi$a4;
@@ -410,6 +389,32 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
           type: 'separator'
         }]));
       }
+      if (toolbarItems.length > 0 && editorExperiment('platform_editor_controls', 'variant1')) {
+        var overflowMenuConfig = [{
+          type: 'separator',
+          supportsViewMode: true,
+          fullHeight: 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.7",
 	"description": "Card plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -63,7 +63,7 @@
 		"@atlaskit/smart-card": "^35.1.0",
 		"@atlaskit/theme": "^17.0.0",
 		"@atlaskit/tmp-editor-statsig": "^3.3.0",
-		"@atlaskit/tokens": "^4.2.0",
+		"@atlaskit/tokens": "^4.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
 		"lodash": "^4.17.21",