@atlaskit/editor-plugin-table 7.0.0 → 7.0.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-plugin-table
 
+## 7.0.2
+
+### Patch Changes
+
+- [#67831](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/67831) [`6027f6646d15`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/6027f6646d15) - Fix table scroll when pressing CMD+A to select all
+
+## 7.0.1
+
+### Patch Changes
+
+- [#67948](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/67948) [`28fcdf6793a4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/28fcdf6793a4) - Expand/collapse for panel and table color pickers
+
 ## 7.0.0
 
 ### Major Changes

package/dist/cjs/toolbar.js

@@ -485,6 +485,7 @@ var getColorPicker = function getColorPicker(state, menu, _ref5, editorAnalytics
     id: 'editor.table.colorPicker',
     title: formatMessage(_messages.tableMessages.cellBackground),
     type: 'select',
+    isAriaExpanded: true,
     selectType: 'color',
     defaultValue: defaultPalette,
     options: _uiColor.cellBackgroundColorPalette,

package/dist/cjs/ui/common-styles.js

@@ -27,7 +27,7 @@ var cornerControlHeight = _consts.tableToolbarSize + 1;
 */
 var insertColumnButtonOffset = exports.insertColumnButtonOffset = _consts.tableInsertColumnButtonSize / 2;
 var tableRowHeight = exports.tableRowHeight = 44;
-var rangeSelectionStyles = "\n.".concat(_types.TableCssClassName.NODEVIEW_WRAPPER, ".").concat(_editorSharedStyles.akEditorSelectedNodeClassName, " table tbody tr {\n  th,td {\n    ").concat((0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Blanket, _editorSharedStyles.SelectionStyle.Border]), "\n  }\n}\n");
+var rangeSelectionStyles = "\n.".concat(_types.TableCssClassName.NODEVIEW_WRAPPER, ".").concat(_editorSharedStyles.akEditorSelectedNodeClassName, " table tbody tr {\n  th,td {\n    ").concat((0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Blanket, _editorSharedStyles.SelectionStyle.Border]), "\n\n    // The non-break space /00a0 in :after selector caused a table scroll issue when pressing Cmd+A to select table\n    // This line is to override the content of :after selector from the shared getSelectionStyles\n    &::after {\n      content: '';\n    }\n  }\n}\n");
 var sentinelStyles = ".".concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n  > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_TOP, ", > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n    position: absolute;\n    width: 100%;\n    height: 1px;\n    margin-top: -1px;\n    // need this to avoid sentinel being focused via keyboard\n    // this still allows it to be detected by intersection observer\n    visibility: hidden;\n  }\n  > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_TOP, " {\n    top: ").concat(_consts.columnControlsDecorationHeight, "px;\n  }\n  > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n      bottom: ").concat(_consts.tableScrollbarOffset + _consts.stickyRowOffsetTop + _consts.tablePadding * 2 + 23, "px;\n  }\n  &.").concat(_types.TableCssClassName.WITH_CONTROLS, " {\n    > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_TOP, " {\n      top: 0px;\n    }\n    > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n      margin-bottom: ").concat(_consts.columnControlsDecorationHeight, "px;\n    }\n  }\n}");
 var stickyScrollbarSentinelStyles = ".".concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n > .").concat(_types.TableCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM, ",\n > .").concat(_types.TableCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_TOP, " {\n    position: absolute;\n    width: 100%;\n    height: 1px;\n    margin-top: -1px;\n    // need this to avoid sentinel being focused via keyboard\n    // this still allows it to be detected by intersection observer\n    visibility: hidden;\n  }\n  > .").concat(_types.TableCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_TOP, " {\n    top: ").concat(_consts.columnControlsDecorationHeight + tableRowHeight * 3, "px;\n  }\n  > .").concat(_types.TableCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM, " {\n    bottom: ").concat(_editorSharedStyles.MAX_BROWSER_SCROLLBAR_HEIGHT, "px;\n  }\n}");
 var stickyScrollbarContainerStyles = ".".concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n  > .").concat(_types.TableCssClassName.TABLE_STICKY_SCROLLBAR_CONTAINER, " {\n    width: 100%;\n    display: none;\n    overflow-x: auto;\n    position: sticky;\n    bottom: 0;\n    z-index: 1;\n  }\n}");

package/dist/es2019/toolbar.js

@@ -462,6 +462,7 @@ const getColorPicker = (state, menu, {
     id: 'editor.table.colorPicker',
     title: formatMessage(messages.cellBackground),
     type: 'select',
+    isAriaExpanded: true,
     selectType: 'color',
     defaultValue: defaultPalette,
     options: cellBackgroundColorPalette,

package/dist/es2019/ui/common-styles.js

@@ -22,6 +22,12 @@ const rangeSelectionStyles = `
 .${ClassName.NODEVIEW_WRAPPER}.${akEditorSelectedNodeClassName} table tbody tr {
   th,td {
     ${getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.Border])}
+
+    // The non-break space /00a0 in :after selector caused a table scroll issue when pressing Cmd+A to select table
+    // This line is to override the content of :after selector from the shared getSelectionStyles
+    &::after {
+      content: '';
+    }
   }
 }
 `;

package/dist/esm/toolbar.js

@@ -474,6 +474,7 @@ var getColorPicker = function getColorPicker(state, menu, _ref5, editorAnalytics
     id: 'editor.table.colorPicker',
     title: formatMessage(messages.cellBackground),
     type: 'select',
+    isAriaExpanded: true,
     selectType: 'color',
     defaultValue: defaultPalette,
     options: cellBackgroundColorPalette,

package/dist/esm/ui/common-styles.js

@@ -20,7 +20,7 @@ var cornerControlHeight = tableToolbarSize + 1;
 */
 export var insertColumnButtonOffset = tableInsertColumnButtonSize / 2;
 export var tableRowHeight = 44;
-var rangeSelectionStyles = "\n.".concat(ClassName.NODEVIEW_WRAPPER, ".").concat(akEditorSelectedNodeClassName, " table tbody tr {\n  th,td {\n    ").concat(getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.Border]), "\n  }\n}\n");
+var rangeSelectionStyles = "\n.".concat(ClassName.NODEVIEW_WRAPPER, ".").concat(akEditorSelectedNodeClassName, " table tbody tr {\n  th,td {\n    ").concat(getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.Border]), "\n\n    // The non-break space /00a0 in :after selector caused a table scroll issue when pressing Cmd+A to select table\n    // This line is to override the content of :after selector from the shared getSelectionStyles\n    &::after {\n      content: '';\n    }\n  }\n}\n");
 var sentinelStyles = ".".concat(ClassName.TABLE_CONTAINER, " {\n  > .").concat(ClassName.TABLE_STICKY_SENTINEL_TOP, ", > .").concat(ClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n    position: absolute;\n    width: 100%;\n    height: 1px;\n    margin-top: -1px;\n    // need this to avoid sentinel being focused via keyboard\n    // this still allows it to be detected by intersection observer\n    visibility: hidden;\n  }\n  > .").concat(ClassName.TABLE_STICKY_SENTINEL_TOP, " {\n    top: ").concat(columnControlsDecorationHeight, "px;\n  }\n  > .").concat(ClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n      bottom: ").concat(tableScrollbarOffset + stickyRowOffsetTop + tablePadding * 2 + 23, "px;\n  }\n  &.").concat(ClassName.WITH_CONTROLS, " {\n    > .").concat(ClassName.TABLE_STICKY_SENTINEL_TOP, " {\n      top: 0px;\n    }\n    > .").concat(ClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n      margin-bottom: ").concat(columnControlsDecorationHeight, "px;\n    }\n  }\n}");
 var stickyScrollbarSentinelStyles = ".".concat(ClassName.TABLE_CONTAINER, " {\n > .").concat(ClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM, ",\n > .").concat(ClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_TOP, " {\n    position: absolute;\n    width: 100%;\n    height: 1px;\n    margin-top: -1px;\n    // need this to avoid sentinel being focused via keyboard\n    // this still allows it to be detected by intersection observer\n    visibility: hidden;\n  }\n  > .").concat(ClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_TOP, " {\n    top: ").concat(columnControlsDecorationHeight + tableRowHeight * 3, "px;\n  }\n  > .").concat(ClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM, " {\n    bottom: ").concat(MAX_BROWSER_SCROLLBAR_HEIGHT, "px;\n  }\n}");
 var stickyScrollbarContainerStyles = ".".concat(ClassName.TABLE_CONTAINER, " {\n  > .").concat(ClassName.TABLE_STICKY_SCROLLBAR_CONTAINER, " {\n    width: 100%;\n    display: none;\n    overflow-x: auto;\n    position: sticky;\n    bottom: 0;\n    z-index: 1;\n  }\n}");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "7.0.0",
+  "version": "7.0.2",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/src/toolbar.tsx

@@ -727,6 +727,7 @@ const getColorPicker = (
       id: 'editor.table.colorPicker',
       title: formatMessage(messages.cellBackground),
       type: 'select',
+      isAriaExpanded: true,
       selectType: 'color',
       defaultValue: defaultPalette,
       options: cellBackgroundColorPalette,

package/src/ui/common-styles.ts

@@ -89,6 +89,12 @@ const rangeSelectionStyles = `
 .${ClassName.NODEVIEW_WRAPPER}.${akEditorSelectedNodeClassName} table tbody tr {
   th,td {
     ${getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.Border])}
+
+    // The non-break space /00a0 in :after selector caused a table scroll issue when pressing Cmd+A to select table
+    // This line is to override the content of :after selector from the shared getSelectionStyles
+    &::after {
+      content: '';
+    }
   }
 }
 `;