@atlaskit/editor-plugin-table 13.0.4 → 13.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,13 @@
1
1
  # @atlaskit/editor-plugin-table
2
2
 
3
+ ## 13.0.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [`255837cfba315`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/255837cfba315) -
8
+ Internal changes to how border radius is applied.
9
+ - Updated dependencies
10
+
3
11
  ## 13.0.4
4
12
 
5
13
  ### Patch Changes
@@ -82,7 +82,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
82
82
  _this.options = props.options;
83
83
  _this.getEditorFeatureFlags = props.getEditorFeatureFlags;
84
84
  _this.handleRef = function (node) {
85
- return _this._handleTableRef(node, props.node);
85
+ return _this._handleTableRef(node);
86
86
  };
87
87
  return _this;
88
88
  }
@@ -127,7 +127,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
127
127
  */
128
128
  }, {
129
129
  key: "_handleTableRef",
130
- value: function _handleTableRef(node, pmNode) {
130
+ value: function _handleTableRef(node) {
131
131
  var _this2 = this;
132
132
  var oldIgnoreMutation;
133
133
  var selectionBookmark;
@@ -155,8 +155,8 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
155
155
  selectionBookmark = this.view.state.selection.getBookmark();
156
156
  }
157
157
  if (this.dom && (0, _expValEquals.expValEquals)('platform_editor_tables_scaling_css', 'isEnabled', true)) {
158
- this.dom.setAttribute('data-ssr-placeholder', "table-nodeview-".concat(pmNode.attrs.localId));
159
- this.dom.setAttribute('data-ssr-placeholder-replace', "table-nodeview-".concat(pmNode.attrs.localId));
158
+ this.dom.setAttribute('data-ssr-placeholder', "table-nodeview-".concat(this.node.attrs.localId));
159
+ this.dom.setAttribute('data-ssr-placeholder-replace', "table-nodeview-".concat(this.node.attrs.localId));
160
160
  }
161
161
 
162
162
  // Remove the ProseMirror table DOM structure to avoid duplication, as it's replaced with the React table node.
@@ -13,7 +13,7 @@ var _DragInMotionIcon = require("../icons/DragInMotionIcon");
13
13
  var boxStyles = (0, _primitives.xcss)({
14
14
  borderColor: 'color.border.focused',
15
15
  borderStyle: 'solid',
16
- borderRadius: 'border.radius.100',
16
+ borderRadius: 'radius.small',
17
17
  borderWidth: 'border.width.outline',
18
18
  backgroundColor: 'color.blanket.selected'
19
19
  });
@@ -18,7 +18,7 @@ var tableFloatingCellButtonStyles = exports.tableFloatingCellButtonStyles = func
18
18
  '> div': _objectSpread({
19
19
  // Sits behind button to provide surface-color background
20
20
  background: "var(--ds-surface, ".concat(_colors.N20, ")"),
21
- borderRadius: "var(--ds-border-radius, 3px)",
21
+ borderRadius: "var(--ds-radius-small, 3px)",
22
22
  display: 'flex',
23
23
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
24
24
  height: "".concat(_consts.contextualMenuTriggerSize + 2, "px"),
@@ -23,5 +23,5 @@ var cellColourPreviewStyles = exports.cellColourPreviewStyles = function cellCol
23
23
  var tablePopupStyles = exports.tablePopupStyles = function tablePopupStyles(isDragAndDropEnabled
24
24
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
25
25
  ) {
26
- return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 20px;\n\t\t\theight: 20px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 20px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.CONTEXTUAL_SUBMENU, "var(--ds-border-radius, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N60A, ", 0 0 1px ").concat(_colors.N60A), ")"), isDragAndDropEnabled ? _consts.contextualMenuDropdownWidthDnD : _consts.contextualMenuDropdownWidth, "var(--ds-space-100, 8px)", _types.TableCssClassName.CONTEXTUAL_MENU_ICON, _adfSchema.tableBackgroundBorderColor, "var(--ds-border-radius, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(_colors.N90, ")"), _types.TableCssClassName.CONTEXTUAL_MENU_ICON_SMALL, _adfSchema.tableBackgroundBorderColor, "var(--ds-border-radius, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(_colors.N90, ")"));
26
+ return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 20px;\n\t\t\theight: 20px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 20px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.CONTEXTUAL_SUBMENU, "var(--ds-radius-small, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N60A, ", 0 0 1px ").concat(_colors.N60A), ")"), isDragAndDropEnabled ? _consts.contextualMenuDropdownWidthDnD : _consts.contextualMenuDropdownWidth, "var(--ds-space-100, 8px)", _types.TableCssClassName.CONTEXTUAL_MENU_ICON, _adfSchema.tableBackgroundBorderColor, "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(_colors.N90, ")"), _types.TableCssClassName.CONTEXTUAL_MENU_ICON_SMALL, _adfSchema.tableBackgroundBorderColor, "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(_colors.N90, ")"));
27
27
  };
@@ -23,7 +23,7 @@ var cellColourPreviewStyles = exports.cellColourPreviewStyles = function cellCol
23
23
 
24
24
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
25
25
  var dragMenuBackgroundColorStyles = exports.dragMenuBackgroundColorStyles = function dragMenuBackgroundColorStyles() {
26
- return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: ", "px; /* move the submenu down when 'sort increasing/decreasing' appear before background color picker */\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.DRAG_SUBMENU, "var(--ds-border-radius, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N60A, ", 0 0 1px ").concat(_colors.N60A), ")"), _consts.TABLE_DRAG_MENU_PADDING_TOP + _consts.TABLE_DRAG_MENU_SORT_GROUP_HEIGHT + _consts.TABLE_DRAG_MENU_MENU_GROUP_BEFORE_HEIGHT, _consts.dragMenuDropdownWidth, "var(--ds-space-100, 8px)", _types.TableCssClassName.DRAG_SUBMENU_ICON, _adfSchema.tableBackgroundBorderColor, "var(--ds-border-radius, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(_colors.N90, ")"));
26
+ return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: ", "px; /* move the submenu down when 'sort increasing/decreasing' appear before background color picker */\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.DRAG_SUBMENU, "var(--ds-radius-small, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N60A, ", 0 0 1px ").concat(_colors.N60A), ")"), _consts.TABLE_DRAG_MENU_PADDING_TOP + _consts.TABLE_DRAG_MENU_SORT_GROUP_HEIGHT + _consts.TABLE_DRAG_MENU_MENU_GROUP_BEFORE_HEIGHT, _consts.dragMenuDropdownWidth, "var(--ds-space-100, 8px)", _types.TableCssClassName.DRAG_SUBMENU_ICON, _adfSchema.tableBackgroundBorderColor, "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(_colors.N90, ")"));
27
27
  };
28
28
 
29
29
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
@@ -15,7 +15,7 @@ var tableFullWidthLabelWrapperStyles = (0, _primitives.xcss)({
15
15
  height: "var(--ds-space-400, 32px)",
16
16
  display: 'flex',
17
17
  backgroundColor: 'elevation.surface.overlay',
18
- borderRadius: 'border.radius',
18
+ borderRadius: 'radius.small',
19
19
  boxShadow: 'elevation.shadow.overlay',
20
20
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
21
21
  lineHeight: 1,
@@ -35,7 +35,7 @@ var InsertMarker = exports.InsertMarker = function InsertMarker(cssString) {
35
35
  return (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\t", ";\n\t\t", "\n\t}\n"])), _types.TableCssClassName.CONTROLS_INSERT_MARKER, Marker(), cssString);
36
36
  };
37
37
  var Button = function Button(cssString) {
38
- return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\tborder-radius: ", ";\n\tborder-width: 0px;\n\tdisplay: inline-flex;\n\tmax-width: 100%;\n\ttext-align: center;\n\tmargin: 0px;\n\tpadding: 0px;\n\ttext-decoration: none;\n\ttransition:\n\t\tbackground 0.1s ease-out 0s,\n\t\tbox-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\n\toutline: none !important;\n\tcursor: none;\n\n\t> .", " {\n\t\tdisplay: inline-flex;\n\t\tmax-height: 100%;\n\t\tmax-width: 100%;\n\t}\n\t", "\n"])), "var(--ds-border-radius, 3px)", _types.TableCssClassName.CONTROLS_BUTTON_ICON, cssString);
38
+ return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\tborder-radius: ", ";\n\tborder-width: 0px;\n\tdisplay: inline-flex;\n\tmax-width: 100%;\n\ttext-align: center;\n\tmargin: 0px;\n\tpadding: 0px;\n\ttext-decoration: none;\n\ttransition:\n\t\tbackground 0.1s ease-out 0s,\n\t\tbox-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\n\toutline: none !important;\n\tcursor: none;\n\n\t> .", " {\n\t\tdisplay: inline-flex;\n\t\tmax-height: 100%;\n\t\tmax-width: 100%;\n\t}\n\t", "\n"])), "var(--ds-radius-small, 3px)", _types.TableCssClassName.CONTROLS_BUTTON_ICON, cssString);
39
39
  };
40
40
 
41
41
  // Explicit pixel values required here to ensure classic row controls align correctly
@@ -62,7 +62,7 @@ export default class TableView extends ReactNodeView {
62
62
  this.eventDispatcher = props.eventDispatcher;
63
63
  this.options = props.options;
64
64
  this.getEditorFeatureFlags = props.getEditorFeatureFlags;
65
- this.handleRef = node => this._handleTableRef(node, props.node);
65
+ this.handleRef = node => this._handleTableRef(node);
66
66
  }
67
67
  getContentDOM() {
68
68
  var _this$reactComponentP, _this$reactComponentP2, _this$reactComponentP3, _this$reactComponentP4;
@@ -100,7 +100,7 @@ export default class TableView extends ReactNodeView {
100
100
  * wasn't at start of node. This prevents duplicate tables and maintains editor state during
101
101
  * the DOM manipulation.
102
102
  */
103
- _handleTableRef(node, pmNode) {
103
+ _handleTableRef(node) {
104
104
  let oldIgnoreMutation;
105
105
  let selectionBookmark;
106
106
  let mutationsIgnored = false;
@@ -127,8 +127,8 @@ export default class TableView extends ReactNodeView {
127
127
  selectionBookmark = this.view.state.selection.getBookmark();
128
128
  }
129
129
  if (this.dom && expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
130
- this.dom.setAttribute('data-ssr-placeholder', `table-nodeview-${pmNode.attrs.localId}`);
131
- this.dom.setAttribute('data-ssr-placeholder-replace', `table-nodeview-${pmNode.attrs.localId}`);
130
+ this.dom.setAttribute('data-ssr-placeholder', `table-nodeview-${this.node.attrs.localId}`);
131
+ this.dom.setAttribute('data-ssr-placeholder-replace', `table-nodeview-${this.node.attrs.localId}`);
132
132
  }
133
133
 
134
134
  // Remove the ProseMirror table DOM structure to avoid duplication, as it's replaced with the React table node.
@@ -6,7 +6,7 @@ import { DragInMotionIcon } from '../icons/DragInMotionIcon';
6
6
  const boxStyles = xcss({
7
7
  borderColor: 'color.border.focused',
8
8
  borderStyle: 'solid',
9
- borderRadius: 'border.radius.100',
9
+ borderRadius: 'radius.small',
10
10
  borderWidth: 'border.width.outline',
11
11
  backgroundColor: 'color.blanket.selected'
12
12
  });
@@ -8,7 +8,7 @@ export const tableFloatingCellButtonStyles = () => css({
8
8
  '> div': {
9
9
  // Sits behind button to provide surface-color background
10
10
  background: `var(--ds-surface, ${N20})`,
11
- borderRadius: "var(--ds-border-radius, 3px)",
11
+ borderRadius: "var(--ds-radius-small, 3px)",
12
12
  display: 'flex',
13
13
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
14
14
  height: `${contextualMenuTriggerSize + 2}px`,
@@ -14,7 +14,7 @@ export const tablePopupStyles = (isDragAndDropEnabled
14
14
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
15
15
  ) => css`
16
16
  .${ClassName.CONTEXTUAL_SUBMENU} {
17
- border-radius: ${"var(--ds-border-radius, 3px)"};
17
+ border-radius: ${"var(--ds-radius-small, 3px)"};
18
18
  background: ${"var(--ds-surface-overlay, white)"};
19
19
  box-shadow: ${`var(--ds-shadow-overlay, ${`0 4px 8px -2px ${N60A}, 0 0 1px ${N60A}`})`};
20
20
  display: block;
@@ -35,7 +35,7 @@ export const tablePopupStyles = (isDragAndDropEnabled
35
35
  content: '';
36
36
  display: block;
37
37
  border: 1px solid ${tableBackgroundBorderColor};
38
- border-radius: ${"var(--ds-border-radius, 3px)"};
38
+ border-radius: ${"var(--ds-radius-small, 3px)"};
39
39
  width: 20px;
40
40
  height: 20px;
41
41
  }
@@ -55,7 +55,7 @@ export const tablePopupStyles = (isDragAndDropEnabled
55
55
  content: '';
56
56
  display: block;
57
57
  border: 1px solid ${tableBackgroundBorderColor};
58
- border-radius: ${"var(--ds-border-radius, 3px)"};
58
+ border-radius: ${"var(--ds-radius-small, 3px)"};
59
59
  width: 14px;
60
60
  height: 14px;
61
61
  }
@@ -14,7 +14,7 @@ export const cellColourPreviewStyles = selectedColor => css({
14
14
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
15
15
  export const dragMenuBackgroundColorStyles = () => css`
16
16
  .${ClassName.DRAG_SUBMENU} {
17
- border-radius: ${"var(--ds-border-radius, 3px)"};
17
+ border-radius: ${"var(--ds-radius-small, 3px)"};
18
18
  background: ${"var(--ds-surface-overlay, white)"};
19
19
  box-shadow: ${`var(--ds-shadow-overlay, ${`0 4px 8px -2px ${N60A}, 0 0 1px ${N60A}`})`};
20
20
  display: block;
@@ -35,7 +35,7 @@ export const dragMenuBackgroundColorStyles = () => css`
35
35
  content: '';
36
36
  display: block;
37
37
  border: 1px solid ${tableBackgroundBorderColor};
38
- border-radius: ${"var(--ds-border-radius, 3px)"};
38
+ border-radius: ${"var(--ds-radius-small, 3px)"};
39
39
  width: 14px;
40
40
  height: 14px;
41
41
  }
@@ -7,7 +7,7 @@ const tableFullWidthLabelWrapperStyles = xcss({
7
7
  height: "var(--ds-space-400, 32px)",
8
8
  display: 'flex',
9
9
  backgroundColor: 'elevation.surface.overlay',
10
- borderRadius: 'border.radius',
10
+ borderRadius: 'radius.small',
11
11
  boxShadow: 'elevation.shadow.overlay',
12
12
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
13
13
  lineHeight: 1,
@@ -33,7 +33,7 @@ export const InsertMarker = cssString => css`
33
33
  }
34
34
  `;
35
35
  const Button = cssString => css`
36
- border-radius: ${"var(--ds-border-radius, 3px)"};
36
+ border-radius: ${"var(--ds-radius-small, 3px)"};
37
37
  border-width: 0px;
38
38
  display: inline-flex;
39
39
  max-width: 100%;
@@ -75,7 +75,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
75
75
  _this.options = props.options;
76
76
  _this.getEditorFeatureFlags = props.getEditorFeatureFlags;
77
77
  _this.handleRef = function (node) {
78
- return _this._handleTableRef(node, props.node);
78
+ return _this._handleTableRef(node);
79
79
  };
80
80
  return _this;
81
81
  }
@@ -120,7 +120,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
120
120
  */
121
121
  }, {
122
122
  key: "_handleTableRef",
123
- value: function _handleTableRef(node, pmNode) {
123
+ value: function _handleTableRef(node) {
124
124
  var _this2 = this;
125
125
  var oldIgnoreMutation;
126
126
  var selectionBookmark;
@@ -148,8 +148,8 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
148
148
  selectionBookmark = this.view.state.selection.getBookmark();
149
149
  }
150
150
  if (this.dom && expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
151
- this.dom.setAttribute('data-ssr-placeholder', "table-nodeview-".concat(pmNode.attrs.localId));
152
- this.dom.setAttribute('data-ssr-placeholder-replace', "table-nodeview-".concat(pmNode.attrs.localId));
151
+ this.dom.setAttribute('data-ssr-placeholder', "table-nodeview-".concat(this.node.attrs.localId));
152
+ this.dom.setAttribute('data-ssr-placeholder-replace', "table-nodeview-".concat(this.node.attrs.localId));
153
153
  }
154
154
 
155
155
  // Remove the ProseMirror table DOM structure to avoid duplication, as it's replaced with the React table node.
@@ -6,7 +6,7 @@ import { DragInMotionIcon } from '../icons/DragInMotionIcon';
6
6
  var boxStyles = xcss({
7
7
  borderColor: 'color.border.focused',
8
8
  borderStyle: 'solid',
9
- borderRadius: 'border.radius.100',
9
+ borderRadius: 'radius.small',
10
10
  borderWidth: 'border.width.outline',
11
11
  backgroundColor: 'color.blanket.selected'
12
12
  });
@@ -12,7 +12,7 @@ export var tableFloatingCellButtonStyles = function tableFloatingCellButtonStyle
12
12
  '> div': _objectSpread({
13
13
  // Sits behind button to provide surface-color background
14
14
  background: "var(--ds-surface, ".concat(N20, ")"),
15
- borderRadius: "var(--ds-border-radius, 3px)",
15
+ borderRadius: "var(--ds-radius-small, 3px)",
16
16
  display: 'flex',
17
17
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
18
18
  height: "".concat(contextualMenuTriggerSize + 2, "px"),
@@ -17,5 +17,5 @@ export var cellColourPreviewStyles = function cellColourPreviewStyles(selectedCo
17
17
  export var tablePopupStyles = function tablePopupStyles(isDragAndDropEnabled
18
18
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
19
19
  ) {
20
- return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 20px;\n\t\t\theight: 20px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 20px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), ClassName.CONTEXTUAL_SUBMENU, "var(--ds-border-radius, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A), ")"), isDragAndDropEnabled ? contextualMenuDropdownWidthDnD : contextualMenuDropdownWidth, "var(--ds-space-100, 8px)", ClassName.CONTEXTUAL_MENU_ICON, tableBackgroundBorderColor, "var(--ds-border-radius, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(N90, ")"), ClassName.CONTEXTUAL_MENU_ICON_SMALL, tableBackgroundBorderColor, "var(--ds-border-radius, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(N90, ")"));
20
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 20px;\n\t\t\theight: 20px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 20px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), ClassName.CONTEXTUAL_SUBMENU, "var(--ds-radius-small, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A), ")"), isDragAndDropEnabled ? contextualMenuDropdownWidthDnD : contextualMenuDropdownWidth, "var(--ds-space-100, 8px)", ClassName.CONTEXTUAL_MENU_ICON, tableBackgroundBorderColor, "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(N90, ")"), ClassName.CONTEXTUAL_MENU_ICON_SMALL, tableBackgroundBorderColor, "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(N90, ")"));
21
21
  };
@@ -17,7 +17,7 @@ export var cellColourPreviewStyles = function cellColourPreviewStyles(selectedCo
17
17
 
18
18
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
19
19
  export var dragMenuBackgroundColorStyles = function dragMenuBackgroundColorStyles() {
20
- return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: ", "px; /* move the submenu down when 'sort increasing/decreasing' appear before background color picker */\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), ClassName.DRAG_SUBMENU, "var(--ds-border-radius, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A), ")"), TABLE_DRAG_MENU_PADDING_TOP + TABLE_DRAG_MENU_SORT_GROUP_HEIGHT + TABLE_DRAG_MENU_MENU_GROUP_BEFORE_HEIGHT, dragMenuDropdownWidth, "var(--ds-space-100, 8px)", ClassName.DRAG_SUBMENU_ICON, tableBackgroundBorderColor, "var(--ds-border-radius, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(N90, ")"));
20
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: ", "px; /* move the submenu down when 'sort increasing/decreasing' appear before background color picker */\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), ClassName.DRAG_SUBMENU, "var(--ds-radius-small, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A), ")"), TABLE_DRAG_MENU_PADDING_TOP + TABLE_DRAG_MENU_SORT_GROUP_HEIGHT + TABLE_DRAG_MENU_MENU_GROUP_BEFORE_HEIGHT, dragMenuDropdownWidth, "var(--ds-space-100, 8px)", ClassName.DRAG_SUBMENU_ICON, tableBackgroundBorderColor, "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(N90, ")"));
21
21
  };
22
22
 
23
23
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
@@ -7,7 +7,7 @@ var tableFullWidthLabelWrapperStyles = xcss({
7
7
  height: "var(--ds-space-400, 32px)",
8
8
  display: 'flex',
9
9
  backgroundColor: 'elevation.surface.overlay',
10
- borderRadius: 'border.radius',
10
+ borderRadius: 'radius.small',
11
11
  boxShadow: 'elevation.shadow.overlay',
12
12
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
13
13
  lineHeight: 1,
@@ -28,7 +28,7 @@ export var InsertMarker = function InsertMarker(cssString) {
28
28
  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t.", " {\n\t\t", ";\n\t\t", "\n\t}\n"])), ClassName.CONTROLS_INSERT_MARKER, Marker(), cssString);
29
29
  };
30
30
  var Button = function Button(cssString) {
31
- return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\tborder-radius: ", ";\n\tborder-width: 0px;\n\tdisplay: inline-flex;\n\tmax-width: 100%;\n\ttext-align: center;\n\tmargin: 0px;\n\tpadding: 0px;\n\ttext-decoration: none;\n\ttransition:\n\t\tbackground 0.1s ease-out 0s,\n\t\tbox-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\n\toutline: none !important;\n\tcursor: none;\n\n\t> .", " {\n\t\tdisplay: inline-flex;\n\t\tmax-height: 100%;\n\t\tmax-width: 100%;\n\t}\n\t", "\n"])), "var(--ds-border-radius, 3px)", ClassName.CONTROLS_BUTTON_ICON, cssString);
31
+ return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\tborder-radius: ", ";\n\tborder-width: 0px;\n\tdisplay: inline-flex;\n\tmax-width: 100%;\n\ttext-align: center;\n\tmargin: 0px;\n\tpadding: 0px;\n\ttext-decoration: none;\n\ttransition:\n\t\tbackground 0.1s ease-out 0s,\n\t\tbox-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38) 0s;\n\toutline: none !important;\n\tcursor: none;\n\n\t> .", " {\n\t\tdisplay: inline-flex;\n\t\tmax-height: 100%;\n\t\tmax-width: 100%;\n\t}\n\t", "\n"])), "var(--ds-radius-small, 3px)", ClassName.CONTROLS_BUTTON_ICON, cssString);
32
32
  };
33
33
 
34
34
  // Explicit pixel values required here to ensure classic row controls align correctly
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "13.0.4",
3
+ "version": "13.0.5",
4
4
  "description": "Table plugin for the @atlaskit/editor",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -37,7 +37,7 @@
37
37
  "@atlaskit/editor-plugin-batch-attribute-updates": "^4.0.0",
38
38
  "@atlaskit/editor-plugin-content-insertion": "^4.0.0",
39
39
  "@atlaskit/editor-plugin-editor-viewmode": "^6.0.0",
40
- "@atlaskit/editor-plugin-extension": "7.0.1",
40
+ "@atlaskit/editor-plugin-extension": "7.0.2",
41
41
  "@atlaskit/editor-plugin-guideline": "^4.0.0",
42
42
  "@atlaskit/editor-plugin-interaction": "^6.0.0",
43
43
  "@atlaskit/editor-plugin-limited-mode": "^1.0.0",
@@ -57,7 +57,7 @@
57
57
  "@atlaskit/primitives": "^14.12.0",
58
58
  "@atlaskit/react-ufo": "^4.5.0",
59
59
  "@atlaskit/theme": "^20.0.0",
60
- "@atlaskit/tmp-editor-statsig": "^12.1.0",
60
+ "@atlaskit/tmp-editor-statsig": "^12.2.0",
61
61
  "@atlaskit/toggle": "^15.1.0",
62
62
  "@atlaskit/tokens": "^6.1.0",
63
63
  "@atlaskit/tooltip": "^20.4.0",
@@ -70,7 +70,7 @@
70
70
  "uuid": "^3.1.0"
71
71
  },
72
72
  "peerDependencies": {
73
- "@atlaskit/editor-common": "^108.0.0",
73
+ "@atlaskit/editor-common": "^108.1.0",
74
74
  "react": "^18.2.0",
75
75
  "react-dom": "^18.2.0",
76
76
  "react-intl-next": "npm:react-intl@^5.18.1"