@atlaskit/editor-plugin-table 10.5.7 → 10.5.8

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-table
 
+## 10.5.8
+
+### Patch Changes
+
+- [#134468](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/134468)
+  [`e312ec529d05a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e312ec529d05a) -
+  [ux] Apply hover decoration when hovering on copy/delete button on overflow menu
+- Updated dependencies
+
 ## 10.5.7
 
 ### Patch Changes

package/dist/cjs/ui/toolbar.js

@@ -454,6 +454,14 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
           }]
         };
         var isNestedTable = (0, _platformFeatureFlags.fg)('platform_editor_use_nested_table_pm_nodes') && (0, _nesting.isSelectionTableNestedInTable)(state);
+        var hoverTableProps = function hoverTableProps(isInDanger, isSelected) {
+          return (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_1') ? {
+            onMouseEnter: (0, _commands.hoverTable)(isInDanger, isSelected),
+            onMouseLeave: (0, _commands.clearHoverSelection)(),
+            onFocus: (0, _commands.hoverTable)(isInDanger, isSelected),
+            onBlur: (0, _commands.clearHoverSelection)()
+          } : undefined;
+        };
         return {
           title: 'Table floating controls',
           getDomRef: getDomRef,
@@ -498,7 +506,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
                   }
                 });
               }
-            }, {
+            }, _objectSpread({
               title: intl.formatMessage(_messages.default.copyToClipboard),
               onClick: function onClick() {
                 var _api$core, _api$floatingToolbar;
@@ -509,13 +517,13 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
               icon: (0, _react.jsx)(_copy.default, {
                 label: intl.formatMessage(_messages.default.copyToClipboard)
               })
-            }, {
+            }, hoverTableProps(false, true)), _objectSpread({
               title: intl.formatMessage(_messages.default.delete),
               onClick: (0, _commandsWithAnalytics.deleteTableWithAnalytics)(editorAnalyticsAPI),
               icon: (0, _react.jsx)(_deleteEditorRemove.default, {
                 label: intl.formatMessage(_messages.default.delete)
               })
-            }]
+            }, hoverTableProps(true))]
           }])),
           scrollable: true
         };

package/dist/es2019/ui/toolbar.js

@@ -426,6 +426,12 @@ export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAP
       }]
     };
     const isNestedTable = fg('platform_editor_use_nested_table_pm_nodes') && isSelectionTableNestedInTable(state);
+    const hoverTableProps = (isInDanger, isSelected) => fg('platform_editor_controls_patch_1') ? {
+      onMouseEnter: hoverTable(isInDanger, isSelected),
+      onMouseLeave: clearHoverSelection(),
+      onFocus: hoverTable(isInDanger, isSelected),
+      onBlur: clearHoverSelection()
+    } : undefined;
     return {
       title: 'Table floating controls',
       getDomRef,
@@ -480,13 +486,15 @@ export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAP
           },
           icon: jsx(CopyIcon, {
             label: intl.formatMessage(commonMessages.copyToClipboard)
-          })
+          }),
+          ...hoverTableProps(false, true)
         }, {
           title: intl.formatMessage(commonMessages.delete),
           onClick: deleteTableWithAnalytics(editorAnalyticsAPI),
           icon: jsx(DeleteIcon, {
             label: intl.formatMessage(commonMessages.delete)
-          })
+          }),
+          ...hoverTableProps(true)
         }]
       }])],
       scrollable: true

package/dist/esm/ui/toolbar.js

@@ -446,6 +446,14 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
           }]
         };
         var isNestedTable = fg('platform_editor_use_nested_table_pm_nodes') && isSelectionTableNestedInTable(state);
+        var hoverTableProps = function hoverTableProps(isInDanger, isSelected) {
+          return fg('platform_editor_controls_patch_1') ? {
+            onMouseEnter: hoverTable(isInDanger, isSelected),
+            onMouseLeave: clearHoverSelection(),
+            onFocus: hoverTable(isInDanger, isSelected),
+            onBlur: clearHoverSelection()
+          } : undefined;
+        };
         return {
           title: 'Table floating controls',
           getDomRef: getDomRef,
@@ -490,7 +498,7 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
                   }
                 });
               }
-            }, {
+            }, _objectSpread({
               title: intl.formatMessage(commonMessages.copyToClipboard),
               onClick: function onClick() {
                 var _api$core, _api$floatingToolbar;
@@ -501,13 +509,13 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
               icon: jsx(CopyIcon, {
                 label: intl.formatMessage(commonMessages.copyToClipboard)
               })
-            }, {
+            }, hoverTableProps(false, true)), _objectSpread({
               title: intl.formatMessage(commonMessages.delete),
               onClick: deleteTableWithAnalytics(editorAnalyticsAPI),
               icon: jsx(DeleteIcon, {
                 label: intl.formatMessage(commonMessages.delete)
               })
-            }]
+            }, hoverTableProps(true))]
           }])),
           scrollable: true
         };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "10.5.7",
+	"version": "10.5.8",
 	"description": "Table plugin for the @atlaskit/editor",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -39,7 +39,7 @@
 		"@atlaskit/editor-plugin-batch-attribute-updates": "^2.1.0",
 		"@atlaskit/editor-plugin-content-insertion": "^2.1.0",
 		"@atlaskit/editor-plugin-editor-viewmode": "^3.0.0",
-		"@atlaskit/editor-plugin-extension": "5.1.0",
+		"@atlaskit/editor-plugin-extension": "5.1.1",
 		"@atlaskit/editor-plugin-guideline": "^2.0.0",
 		"@atlaskit/editor-plugin-selection": "^2.1.0",
 		"@atlaskit/editor-plugin-width": "^3.0.0",
@@ -54,7 +54,7 @@
 		"@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.0.0",
 		"@atlaskit/primitives": "^14.2.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^4.5.0",
+		"@atlaskit/tmp-editor-statsig": "^4.6.0",
 		"@atlaskit/toggle": "^15.0.0",
 		"@atlaskit/tokens": "^4.5.0",
 		"@atlaskit/tooltip": "^20.0.0",
@@ -194,6 +194,9 @@
 		},
 		"platform_editor_nested_tables_cellselection_paste": {
 			"type": "boolean"
+		},
+		"platform_editor_controls_patch_1": {
+			"type": "boolean"
 		}
 	}
 }

package/src/ui/toolbar.tsx

@@ -634,6 +634,16 @@ export const getToolbarConfig =
 			const isNestedTable =
 				fg('platform_editor_use_nested_table_pm_nodes') && isSelectionTableNestedInTable(state);
 
+			const hoverTableProps = (isInDanger?: boolean, isSelected?: boolean) =>
+				fg('platform_editor_controls_patch_1')
+					? {
+							onMouseEnter: hoverTable(isInDanger, isSelected),
+							onMouseLeave: clearHoverSelection(),
+							onFocus: hoverTable(isInDanger, isSelected),
+							onBlur: clearHoverSelection(),
+						}
+					: undefined;
+
 			return {
 				title: 'Table floating controls',
 				getDomRef,
@@ -710,11 +720,13 @@ export const getToolbarConfig =
 												return true;
 											},
 											icon: <CopyIcon label={intl.formatMessage(commonMessages.copyToClipboard)} />,
+											...hoverTableProps(false, true),
 										},
 										{
 											title: intl.formatMessage(commonMessages.delete),
 											onClick: deleteTableWithAnalytics(editorAnalyticsAPI),
 											icon: <DeleteIcon label={intl.formatMessage(commonMessages.delete)} />,
+											...hoverTableProps(true),
 										},
 									],
 								},