@atlaskit/editor-plugin-table 3.0.3 → 3.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # @atlaskit/editor-plugin-table
2
2
 
3
+ ## 3.0.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [`45f669fac0c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/45f669fac0c) - Reduce the width of the last column resizer handle to 5px, this was previously 10px and would interfer with the table cell menu button and other nodes that that also had resize handles
8
+ - Updated dependencies
9
+
10
+ ## 3.0.4
11
+
12
+ ### Patch Changes
13
+
14
+ - [`9e36c4aec5c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9e36c4aec5c) - Fixed a bug in the local id plugin where it was deferred dispatching a transaction created from and old state causing the "Applying a mismatched transaction" runtime error to occur.
15
+
3
16
  ## 3.0.3
4
17
 
5
18
  ### Patch Changes
@@ -91,7 +91,7 @@ var createPlugin = function createPlugin(dispatch) {
91
91
  }
92
92
  var table = state.schema.nodes.table;
93
93
  (0, _rafSchd.default)(function () {
94
- var tr = state.tr;
94
+ var tr = editorView.state.tr;
95
95
  var tableIdWasAdded = false;
96
96
  editorView.state.doc.descendants(function (node, pos) {
97
97
  var isTable = node.type === table;
@@ -92,7 +92,7 @@ var hoveredWarningCell = (0, _react.css)(_templateObject21 || (_templateObject21
92
92
  // move the resize handle zone completely inside the table cell to avoid overflow
93
93
  exports.hoveredWarningCell = hoveredWarningCell;
94
94
  var getLastColumnResizerOverrides = function getLastColumnResizerOverrides() {
95
- return (0, _platformFeatureFlags.getBooleanFF)('platform.editor.custom-table-width') ? (0, _react.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2.default)(["\n tr\n th:last-child\n .", ",\n tr\n td:last-child\n .", " {\n background-color: transparent;\n position: absolute;\n width: ", "px;\n height: 100%;\n top: 0;\n right: 0;\n cursor: col-resize;\n z-index: ", ";\n }\n "])), _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth, _consts.resizeHandlerZIndex) : '';
95
+ return (0, _platformFeatureFlags.getBooleanFF)('platform.editor.custom-table-width') ? (0, _react.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2.default)(["\n tr\n th:last-child\n .", ",\n tr\n td:last-child\n .", " {\n background-color: transparent;\n position: absolute;\n width: ", "px;\n height: 100%;\n top: 0;\n right: 0;\n cursor: col-resize;\n z-index: ", ";\n }\n "])), _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth / 2, _consts.resizeHandlerZIndex) : '';
96
96
  };
97
97
  var resizeHandle = function resizeHandle(props) {
98
98
  return (0, _react.css)(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteral2.default)(["\n .", " {\n .", " {\n background-color: transparent;\n position: absolute;\n width: ", "px;\n height: 100%;\n top: 0;\n right: -", "px;\n cursor: col-resize;\n z-index: ", ";\n }\n\n ", "\n\n td.", "::before {\n content: ' ';\n position: absolute;\n left: ", ";\n top: -1px;\n width: ", "px;\n height: calc(100% + 2px);\n background-color: ", ";\n z-index: ", ";\n }\n\n th.", "::before {\n content: ' ';\n left: ", ";\n position: absolute;\n width: ", "px;\n height: calc(100% + ", "px);\n background-color: ", ";\n z-index: ", ";\n top: -", "px;\n }\n\n td.", "::before {\n content: ' ';\n position: absolute;\n right: -1px;\n top: -1px;\n width: ", "px;\n height: calc(100% + 2px);\n background-color: ", ";\n z-index: ", ";\n }\n\n th.", "::before {\n content: ' ';\n right: -1px;\n position: absolute;\n width: ", "px;\n height: calc(100% + ", "px);\n background-color: ", ";\n z-index: ", ";\n top: -", "px;\n }\n\n table\n tr:first-of-type\n th.", "\n .", "::after,\n table\n tr:first-of-type\n td.", "\n .", "::after {\n top: -", "px;\n height: calc(100% + ", "px);\n }\n }\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth, _consts.resizeHandlerAreaWidth / 2, _consts.resizeHandlerZIndex, getLastColumnResizerOverrides(), _types.TableCssClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, (0, _consts.tableBorderSelectedColor)(props), _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableToolbarSize + _styles.tableCellBorderWidth, (0, _consts.tableBorderSelectedColor)(props), _consts.columnControlsZIndex * 2, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, (0, _consts.tableBorderSelectedColor)(props), _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableToolbarSize + _styles.tableCellBorderWidth, (0, _consts.tableBorderSelectedColor)(props), _consts.columnControlsZIndex * 2, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _consts.tableToolbarSize + _styles.tableCellBorderWidth);
@@ -83,7 +83,7 @@ const createPlugin = dispatch => new SafePlugin({
83
83
  table
84
84
  } = state.schema.nodes;
85
85
  rafSchedule(() => {
86
- const tr = state.tr;
86
+ const tr = editorView.state.tr;
87
87
  let tableIdWasAdded = false;
88
88
  editorView.state.doc.descendants((node, pos) => {
89
89
  const isTable = node.type === table;
@@ -402,7 +402,7 @@ const getLastColumnResizerOverrides = () => {
402
402
  .${ClassName.RESIZE_HANDLE_DECORATION} {
403
403
  background-color: transparent;
404
404
  position: absolute;
405
- width: ${resizeHandlerAreaWidth}px;
405
+ width: ${resizeHandlerAreaWidth / 2}px;
406
406
  height: 100%;
407
407
  top: 0;
408
408
  right: 0;
@@ -85,7 +85,7 @@ var createPlugin = function createPlugin(dispatch) {
85
85
  }
86
86
  var table = state.schema.nodes.table;
87
87
  rafSchedule(function () {
88
- var tr = state.tr;
88
+ var tr = editorView.state.tr;
89
89
  var tableIdWasAdded = false;
90
90
  editorView.state.doc.descendants(function (node, pos) {
91
91
  var isTable = node.type === table;
@@ -72,7 +72,7 @@ export var hoveredWarningCell = css(_templateObject21 || (_templateObject21 = _t
72
72
 
73
73
  // move the resize handle zone completely inside the table cell to avoid overflow
74
74
  var getLastColumnResizerOverrides = function getLastColumnResizerOverrides() {
75
- return getBooleanFF('platform.editor.custom-table-width') ? css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n tr\n th:last-child\n .", ",\n tr\n td:last-child\n .", " {\n background-color: transparent;\n position: absolute;\n width: ", "px;\n height: 100%;\n top: 0;\n right: 0;\n cursor: col-resize;\n z-index: ", ";\n }\n "])), ClassName.RESIZE_HANDLE_DECORATION, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth, resizeHandlerZIndex) : '';
75
+ return getBooleanFF('platform.editor.custom-table-width') ? css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n tr\n th:last-child\n .", ",\n tr\n td:last-child\n .", " {\n background-color: transparent;\n position: absolute;\n width: ", "px;\n height: 100%;\n top: 0;\n right: 0;\n cursor: col-resize;\n z-index: ", ";\n }\n "])), ClassName.RESIZE_HANDLE_DECORATION, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth / 2, resizeHandlerZIndex) : '';
76
76
  };
77
77
  export var resizeHandle = function resizeHandle(props) {
78
78
  return css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n .", " {\n .", " {\n background-color: transparent;\n position: absolute;\n width: ", "px;\n height: 100%;\n top: 0;\n right: -", "px;\n cursor: col-resize;\n z-index: ", ";\n }\n\n ", "\n\n td.", "::before {\n content: ' ';\n position: absolute;\n left: ", ";\n top: -1px;\n width: ", "px;\n height: calc(100% + 2px);\n background-color: ", ";\n z-index: ", ";\n }\n\n th.", "::before {\n content: ' ';\n left: ", ";\n position: absolute;\n width: ", "px;\n height: calc(100% + ", "px);\n background-color: ", ";\n z-index: ", ";\n top: -", "px;\n }\n\n td.", "::before {\n content: ' ';\n position: absolute;\n right: -1px;\n top: -1px;\n width: ", "px;\n height: calc(100% + 2px);\n background-color: ", ";\n z-index: ", ";\n }\n\n th.", "::before {\n content: ' ';\n right: -1px;\n position: absolute;\n width: ", "px;\n height: calc(100% + ", "px);\n background-color: ", ";\n z-index: ", ";\n top: -", "px;\n }\n\n table\n tr:first-of-type\n th.", "\n .", "::after,\n table\n tr:first-of-type\n td.", "\n .", "::after {\n top: -", "px;\n height: calc(100% + ", "px);\n }\n }\n"])), ClassName.TABLE_CONTAINER, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth, resizeHandlerAreaWidth / 2, resizeHandlerZIndex, getLastColumnResizerOverrides(), ClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableToolbarSize + tableCellBorderWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableToolbarSize + tableCellBorderWidth, tableBorderSelectedColor(props), columnControlsZIndex * 2, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, tableToolbarSize + tableCellBorderWidth, tableToolbarSize + tableCellBorderWidth);
@@ -1,4 +1,4 @@
1
- import { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
1
+ import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
2
2
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
3
3
  interface TableLocalIdPluginState {
4
4
  parsedForLocalIds: boolean;
@@ -1,4 +1,4 @@
1
- import { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
1
+ import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
2
2
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
3
3
  interface TableLocalIdPluginState {
4
4
  parsedForLocalIds: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "3.0.3",
3
+ "version": "3.0.5",
4
4
  "description": "Table plugin for the @atlaskit/editor",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -28,7 +28,7 @@
28
28
  },
29
29
  "dependencies": {
30
30
  "@atlaskit/adf-schema": "^29.1.0",
31
- "@atlaskit/editor-common": "^75.1.0",
31
+ "@atlaskit/editor-common": "^75.4.0",
32
32
  "@atlaskit/editor-palette": "1.5.1",
33
33
  "@atlaskit/editor-plugin-analytics": "^0.2.0",
34
34
  "@atlaskit/editor-plugin-content-insertion": "^0.1.0",
@@ -38,7 +38,7 @@
38
38
  "@atlaskit/icon": "^21.12.0",
39
39
  "@atlaskit/platform-feature-flags": "^0.2.1",
40
40
  "@atlaskit/theme": "^12.6.0",
41
- "@atlaskit/tokens": "^1.22.0",
41
+ "@atlaskit/tokens": "^1.25.0",
42
42
  "@atlaskit/tooltip": "^17.8.0",
43
43
  "@babel/runtime": "^7.0.0",
44
44
  "@emotion/react": "^11.7.1",
@@ -59,7 +59,7 @@
59
59
  "@atlaskit/editor-plugin-feature-flags": "^1.0.0",
60
60
  "@atlaskit/editor-plugin-grid": "^0.2.0",
61
61
  "@atlaskit/editor-plugin-guideline": "^0.5.0",
62
- "@atlaskit/editor-plugin-hyperlink": "^0.4.0",
62
+ "@atlaskit/editor-plugin-hyperlink": "^0.5.0",
63
63
  "@atlaskit/editor-plugin-width": "^0.2.0",
64
64
  "@atlaskit/visual-regression": "*",
65
65
  "@atlaskit/webdriver-runner": "*",
@@ -13,11 +13,12 @@
13
13
  import rafSchedule from 'raf-schd';
14
14
 
15
15
  import { uuid } from '@atlaskit/adf-schema';
16
- import { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
16
+ import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
17
17
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
18
18
  import { stepHasSlice } from '@atlaskit/editor-common/utils';
19
- import { Node as ProsemirrorNode } from '@atlaskit/editor-prosemirror/model';
20
- import { EditorState, PluginKey } from '@atlaskit/editor-prosemirror/state';
19
+ import type { Node as ProsemirrorNode } from '@atlaskit/editor-prosemirror/model';
20
+ import type { EditorState } from '@atlaskit/editor-prosemirror/state';
21
+ import { PluginKey } from '@atlaskit/editor-prosemirror/state';
21
22
 
22
23
  interface TableLocalIdPluginState {
23
24
  // One time parse for initial load with existing tables without localIds
@@ -95,7 +96,7 @@ const createPlugin = (dispatch: Dispatch) =>
95
96
 
96
97
  const { table } = state.schema.nodes;
97
98
  rafSchedule(() => {
98
- const tr = state.tr;
99
+ const tr = editorView.state.tr;
99
100
  let tableIdWasAdded = false;
100
101
  editorView.state.doc.descendants((node, pos) => {
101
102
  const isTable = node.type === table;
@@ -481,7 +481,7 @@ const getLastColumnResizerOverrides = () => {
481
481
  .${ClassName.RESIZE_HANDLE_DECORATION} {
482
482
  background-color: transparent;
483
483
  position: absolute;
484
- width: ${resizeHandlerAreaWidth}px;
484
+ width: ${resizeHandlerAreaWidth / 2}px;
485
485
  height: 100%;
486
486
  top: 0;
487
487
  right: 0;