@atlaskit/editor-plugin-table 10.11.3 → 10.11.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 +12 -0
- package/dist/cjs/nodeviews/ExternalDropTargets.js +1 -2
- package/dist/cjs/nodeviews/TableComponent.js +50 -48
- package/dist/cjs/nodeviews/TableContainer.js +1 -2
- package/dist/cjs/nodeviews/TableResizer.js +1 -2
- package/dist/cjs/nodeviews/TableRow.js +3 -1
- package/dist/cjs/nodeviews/lazy-node-views.js +1 -2
- package/dist/cjs/pm-plugins/commands/commands-with-analytics.js +14 -14
- package/dist/cjs/pm-plugins/view-mode-sort/index.js +10 -10
- package/dist/cjs/tablePlugin.js +57 -58
- package/dist/cjs/ui/DragHandle/index.js +1 -2
- package/dist/cjs/ui/FloatingContextualButton/FixedButton.js +1 -2
- package/dist/cjs/ui/FloatingContextualButton/index.js +1 -2
- package/dist/cjs/ui/FloatingContextualMenu/ContextualMenu.js +45 -46
- package/dist/cjs/ui/FloatingDeleteButton/index.js +1 -2
- package/dist/cjs/ui/FloatingDragMenu/DragMenu.js +1 -2
- package/dist/cjs/ui/FloatingDragMenu/DropdownMenu.js +1 -2
- package/dist/cjs/ui/FloatingInsertButton/index.js +1 -2
- package/dist/cjs/ui/TableFloatingColumnControls/ColumnControls/index.js +1 -2
- package/dist/cjs/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.js +1 -2
- package/dist/cjs/ui/TableFloatingColumnControls/ColumnDropTargets/index.js +1 -2
- package/dist/cjs/ui/TableFloatingColumnControls/index.js +1 -2
- package/dist/cjs/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +1 -2
- package/dist/cjs/ui/TableFloatingControls/CornerControls/DragCornerControls.js +1 -2
- package/dist/cjs/ui/TableFloatingControls/NumberColumn/index.js +1 -2
- package/dist/cjs/ui/TableFloatingControls/RowControls/ClassicControls.js +1 -2
- package/dist/cjs/ui/TableFloatingControls/RowControls/DragControls.js +1 -2
- package/dist/cjs/ui/TableFloatingControls/RowDropTarget/index.js +1 -2
- package/dist/cjs/ui/TableFloatingControls/index.js +1 -2
- package/dist/cjs/ui/event-handlers.js +12 -12
- package/dist/cjs/ui/toolbar.js +1 -2
- package/dist/cjs/ui/ui-styles.js +16 -16
- package/dist/es2019/nodeviews/TableComponent.js +8 -6
- package/dist/es2019/nodeviews/TableRow.js +3 -1
- package/dist/esm/nodeviews/TableComponent.js +50 -48
- package/dist/esm/nodeviews/TableRow.js +3 -1
- package/dist/esm/pm-plugins/commands/commands-with-analytics.js +14 -14
- package/dist/esm/pm-plugins/view-mode-sort/index.js +10 -10
- package/dist/esm/tablePlugin.js +56 -56
- package/dist/esm/ui/FloatingContextualMenu/ContextualMenu.js +44 -44
- package/dist/esm/ui/event-handlers.js +12 -12
- package/dist/esm/ui/ui-styles.js +16 -16
- package/package.json +4 -4
- package/src/nodeviews/TableComponent.tsx +1 -1
- package/src/nodeviews/TableRow.ts +1 -1
package/dist/cjs/ui/ui-styles.js
CHANGED
|
@@ -12,7 +12,7 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
|
12
12
|
var _colors = require("@atlaskit/theme/colors");
|
|
13
13
|
var _types = require("../types");
|
|
14
14
|
var _consts = require("./consts");
|
|
15
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22
|
|
15
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
|
|
16
16
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs mahual remediation */
|
|
17
17
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
18
18
|
var InsertLine = function InsertLine(cssString) {
|
|
@@ -62,7 +62,7 @@ var dragInsertButtonWrapper = exports.dragInsertButtonWrapper = function dragIns
|
|
|
62
62
|
// Explicit pixel values required here to ensure corner button aligns correctly
|
|
63
63
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
64
64
|
var dragCornerControlButton = exports.dragCornerControlButton = function dragCornerControlButton() {
|
|
65
|
-
return (0, _react.css)(
|
|
65
|
+
return (0, _react.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\twidth: 15px;\n\t\theight: 15px;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tposition: absolute;\n\t\ttop: -17px;\n\t\tleft: -5px;\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tpadding: 0;\n\t\toutline: none;\n\t\tz-index: ", ";\n\n\t\t&.active .", " {\n\t\t\tbackground-color: ", ";\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t\tborder-width: 2px;\n\t\t\tborder-radius: 4px;\n\n\t\t\ttop: 3px;\n\t\t\tleft: 2px;\n\t\t}\n\n\t\t&:hover {\n\t\t\tcursor: pointer;\n\n\t\t\t.", " {\n\t\t\t\twidth: 10px;\n\t\t\t\theight: 10px;\n\t\t\t\tborder-radius: 4px;\n\t\t\t\ttop: 3px;\n\t\t\t\tleft: 2px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\tborder: 1px solid ", ";\n\t\tbackground-color: ", ";\n\t\tborder-radius: 2px;\n\t\twidth: 5px;\n\t\theight: 5px;\n\t\tposition: relative;\n\t}\n"])), _types.TableCssClassName.DRAG_CORNER_BUTTON, _editorSharedStyles.akEditorUnitZIndex * 99, _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, "var(--ds-border-selected, #0C66E4)", _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, "var(--ds-border-inverse, #FFF)", "var(--ds-background-accent-gray-subtler, #DCDFE4)");
|
|
66
66
|
};
|
|
67
67
|
var insertColumnButtonWrapper = exports.insertColumnButtonWrapper = function insertColumnButtonWrapper() {
|
|
68
68
|
return (0, _react.css)(
|
|
@@ -83,17 +83,17 @@ var insertRowButtonWrapper = exports.insertRowButtonWrapper = function insertRow
|
|
|
83
83
|
InsertLine("\n height: 2px;\n top: -11px;\n\t".concat("\n left: ", _consts.tableInsertColumnButtonSize - 1, "px;\n ")));
|
|
84
84
|
};
|
|
85
85
|
var columnControlsLineMarker = exports.columnControlsLineMarker = function columnControlsLineMarker() {
|
|
86
|
-
return (0, _react.css)(
|
|
86
|
+
return (0, _react.css)(_templateObject1 || (_templateObject1 = (0, _taggedTemplateLiteral2.default)(["\n\t.", ".", " table tr:first-of-type td,\n\t.", ".", " table tr:first-of-type th {\n\t\tposition: relative;\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS);
|
|
87
87
|
};
|
|
88
88
|
var DeleteButton = exports.DeleteButton = function DeleteButton() {
|
|
89
|
-
return (0, _react.css)(
|
|
89
|
+
return (0, _react.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n\t.", ", .", " {\n\t\theight: ", "px;\n\t\twidth: ", "px;\n\t}\n\t.", " {\n\t\t.", " {\n\t\t\t", "\n\t\t}\n\t}\n\n\t.", ":hover {\n\t\tbackground: ", ";\n\t\tcolor: ", ";\n\t\tcursor: pointer;\n\t}\n"])), _types.TableCssClassName.CONTROLS_DELETE_BUTTON_WRAP, _types.TableCssClassName.CONTROLS_DELETE_BUTTON, _consts.tableDeleteButtonSize, _consts.tableDeleteButtonSize, _types.TableCssClassName.CONTROLS_DELETE_BUTTON_WRAP, _types.TableCssClassName.CONTROLS_DELETE_BUTTON, Button("\n background: ".concat(_consts.tableCellSelectedDeleteIconBackground, ";\n color: ").concat(_consts.tableCellSelectedDeleteIconColor, ";\n ")), _types.TableCssClassName.CONTROLS_DELETE_BUTTON, _consts.tableCellHoverDeleteIconBackground, _consts.tableCellHoverDeleteIconColor);
|
|
90
90
|
};
|
|
91
91
|
var OverflowShadow = exports.OverflowShadow = function OverflowShadow(isDragAndDropEnabled) {
|
|
92
|
-
return (0, _react.css)(
|
|
92
|
+
return (0, _react.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n\t.", ", .", " {\n\t\tdisplay: block;\n\t\theight: calc(100% - ", "px);\n\t\tposition: absolute;\n\t\tpointer-events: none;\n\t\ttop: ", "px;\n\t\tz-index: ", ";\n\t\twidth: ", "px;\n\t}\n\t.", " {\n\t\tbackground: linear-gradient(\n\t\t\t\tto left,\n\t\t\t\ttransparent 0,\n\t\t\t\t", " 140%\n\t\t\t),\n\t\t\tlinear-gradient(\n\t\t\t\tto right,\n\t\t\t\t", " 0px,\n\t\t\t\ttransparent 1px\n\t\t\t);\n\t\tleft: 0px;\n\t}\n\t.", "[data-number-column='true'] > :not(.", ").", " {\n\t\tleft: ", "px;\n\t}\n\t.", " {\n\t\tbackground: linear-gradient(\n\t\t\t\tto right,\n\t\t\t\ttransparent 0,\n\t\t\t\t", " 140%\n\t\t\t),\n\t\t\tlinear-gradient(\n\t\t\t\tto left,\n\t\t\t\t", " 0px,\n\t\t\t\ttransparent 1px\n\t\t\t);\n\t\tleft: calc(100% - ", "px);\n\t}\n\t.", " {\n\t\t", "\n\t\t.", " {\n\t\t\tborder-left: 1px solid ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.TABLE_LEFT_SHADOW, _styles.tableMarginTop, _styles.tableMarginTop, _editorSharedStyles.akEditorShadowZIndex, _consts.tableOverflowShadowWidthWide, _types.TableCssClassName.TABLE_LEFT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(_colors.N40A, ")"), "var(--ds-shadow-overflow-perimeter, transparent)", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_STICKY_SHADOW, _types.TableCssClassName.TABLE_LEFT_SHADOW, _editorSharedStyles.akEditorTableNumberColumnWidth - 1, _types.TableCssClassName.TABLE_RIGHT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(_colors.N40A, ")"), "var(--ds-shadow-overflow-perimeter, transparent)", _consts.tableOverflowShadowWidthWide, _types.TableCssClassName.WITH_CONTROLS, overflowShadowWidhoutDnD(isDragAndDropEnabled), _types.TableCssClassName.TABLE_LEFT_SHADOW, _consts.tableBorderColor);
|
|
93
93
|
};
|
|
94
94
|
var overflowShadowWidhoutDnD = function overflowShadowWidhoutDnD(isDragAndDropEnabled) {
|
|
95
95
|
if (!isDragAndDropEnabled) {
|
|
96
|
-
return (0, _react.css)(
|
|
96
|
+
return (0, _react.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t.", ", .", " {\n\t\t\t\theight: calc(100% - ", "px);\n\t\t\t\ttop: ", "px;\n\t\t\t}\n\t\t"])), _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.TABLE_LEFT_SHADOW, _styles.tableMarginTopWithControl, _styles.tableMarginTopWithControl);
|
|
97
97
|
}
|
|
98
98
|
};
|
|
99
99
|
var columnHeaderButton = function columnHeaderButton(cssString) {
|
|
@@ -123,34 +123,34 @@ var columnHeaderButtonSelected = function columnHeaderButtonSelected() {
|
|
|
123
123
|
});
|
|
124
124
|
};
|
|
125
125
|
var getFloatingDotOverrides = function getFloatingDotOverrides() {
|
|
126
|
-
return (0, _react.css)(
|
|
126
|
+
return (0, _react.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n\t\ttr\n\t\t\tth:last-child\n\t\t\t.", "::before,\n\t\t\ttr\n\t\t\ttd:last-child\n\t\t\t.", "::before {\n\t\t\tcontent: '';\n\t\t\tbackground-color: ", ";\n\t\t\tposition: absolute;\n\t\t\theight: ", "px;\n\t\t\twidth: ", "px;\n\t\t\tborder-radius: 50%;\n\t\t\tpointer-events: none;\n\t\t\ttop: ", ";\n\t\t\tright: 0px;\n\t\t}\n\t"])), _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.tableBorderColor, _consts.lineMarkerSize, _consts.lineMarkerSize, "var(--ds-space-025, 2px)");
|
|
127
127
|
};
|
|
128
128
|
var floatingColumnControls = exports.floatingColumnControls = function floatingColumnControls() {
|
|
129
|
-
return (0, _react.css)(
|
|
129
|
+
return (0, _react.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", " {\n\t\t\tbox-sizing: border-box;\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\n\t\t\t.", " {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: row;\n\t\t\t}\n\t\t}\n\n\t\t.", " {\n\t\t\tbox-sizing: border-box;\n\n\t\t\t.", " {\n\t\t\t\tdisplay: grid;\n\t\t\t\tjustify-items: center;\n\t\t\t}\n\t\t}\n\t"])), _types.TableCssClassName.DRAG_COLUMN_DROP_TARGET_CONTROLS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER, _types.TableCssClassName.DRAG_COLUMN_CONTROLS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER);
|
|
130
130
|
};
|
|
131
131
|
var rowControlsWrapperDotStyle = exports.rowControlsWrapperDotStyle = function rowControlsWrapperDotStyle() {
|
|
132
|
-
return (0, _react.css)(
|
|
132
|
+
return (0, _react.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n\t\t/* override for DnD controls */\n\t\tdiv.", ">.", "::after {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tdiv.", ">.", "::after {\n\t\t\tcontent: ' ';\n\t\t\tbackground-color: ", ";\n\t\t\tposition: absolute;\n\t\t\theight: ", "px;\n\t\t\twidth: ", "px;\n\t\t\tborder-radius: 50%;\n\t\t\tpointer-events: none;\n\t\t\ttop: -", "px;\n\t\t\tright: -1px;\n\t\t}\n\t"])), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts.tableBorderColor, _consts.lineMarkerSize, _consts.lineMarkerSize, _consts.tableToolbarSize + _styles.tableCellBorderWidth);
|
|
133
133
|
};
|
|
134
134
|
var columnControlsDecoration = exports.columnControlsDecoration = function columnControlsDecoration() {
|
|
135
|
-
return (0, _react.css)(
|
|
135
|
+
return (0, _react.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", " {\n\t\t\tdisplay: none;\n\t\t\tcursor: pointer;\n\t\t\tposition: absolute;\n\t\t\twidth: 100%;\n\t\t\tleft: 0;\n\t\t\ttop: -", "px;\n\t\t\theight: ", "px;\n\t\t\t/* floating dot for adding column button */\n\t\t\t&::before {\n\t\t\t\tcontent: ' ';\n\t\t\t\tbackground-color: ", ";\n\t\t\t\tposition: absolute;\n\t\t\t\theight: ", "px;\n\t\t\t\twidth: ", "px;\n\t\t\t\tborder-radius: 50%;\n\t\t\t\tpointer-events: none;\n\t\t\t\ttop: 2px;\n\t\t\t\tright: ", ";\n\t\t\t}\n\n\t\t\t&::after {\n\t\t\t\tcontent: ' ';\n\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t/* floating dot for adding column button - overriding style on last column to avoid scroll */\n\t\t", "\n\n\t\t.", " .", " {\n\t\t\tdisplay: block;\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",table\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", ", &.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t}\n\n\t\t\t\t&.", " .", "::after {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tborder-color: ", ";\n\t\t\t\t\tz-index: ", ";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",table\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", ", &.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t\tborder-left: ", "px solid ", ";\n\t\t\t\t\tleft: -", "px;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t}\n\n\t\t\t\t&.", " .", "::after {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tborder-color: ", ";\n\t\t\t\t\tborder-left: ", "px solid ", ";\n\t\t\t\t\tleft: -", "px;\n\t\t\t\t\tz-index: ", ";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t.", "\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",\n\t\t\t.", "\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t.", "::after {\n\t\t\t\t", ";\n\t\t\t}\n\t\t}\n\t"])), _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.columnControlsDecorationHeight + _styles.tableCellBorderWidth, _consts.columnControlsDecorationHeight, _consts.tableBorderColor, _consts.lineMarkerSize, _consts.lineMarkerSize, "var(--ds-space-negative-025, -2px)", columnHeaderButton("\n border-right: ".concat(_styles.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n border-top: ").concat(_styles.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n border-bottom: ").concat(_styles.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n box-sizing: content-box;\n height: ").concat(_consts.tableToolbarSize - 1, "px;\n width: 100%;\n position: absolute;\n top: ").concat(_consts.columnControlsDecorationHeight - _consts.tableToolbarSize, "px;\n left: 0px;\n z-index: ").concat(_consts.columnControlsZIndex, ";\n ")), getFloatingDotOverrides(), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_TABLE, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.tableToolbarDeleteColor, _consts.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_COLUMN, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _styles.tableCellBorderWidth, _consts.tableBorderSelectedColor, _styles.tableCellBorderWidth, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_COLUMN, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.tableToolbarDeleteColor, _consts.tableBorderDeleteColor, _styles.tableCellBorderWidth, _consts.tableBorderDeleteColor, _styles.tableCellBorderWidth, _editorSharedStyles.akEditorUnitZIndex * 100, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected());
|
|
136
136
|
};
|
|
137
137
|
var hoveredDeleteButton = exports.hoveredDeleteButton = function hoveredDeleteButton() {
|
|
138
|
-
return (0, _react.css)(
|
|
138
|
+
return (0, _react.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n\t.", ".", " {\n\t\t.", ", .", ", .", " {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t.", "::after {\n\t\t\tbackground: ", ";\n\t\t}\n\n\t\t.", " > table {\n\t\t\ttd.", "::after {\n\t\t\t\tbackground: ", ";\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t}\n\t\t\tth.", " {\n\t\t\t\tbackground-color: unset;\n\t\t\t}\n\t\t\tth.", "::after {\n\t\t\t\tbackground: ", ";\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.HOVERED_DELETE_BUTTON, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_CELL, _consts.tableBorderDeleteColor, _types.TableCssClassName.SELECTED_CELL, _consts.tableCellDeleteColor, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _consts.tableCellDeleteColor, _consts.tableBorderDeleteColor, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _consts.tableCellDeleteColor, _consts.tableBorderDeleteColor);
|
|
139
139
|
};
|
|
140
140
|
var hoveredCell = exports.hoveredCell = function hoveredCell() {
|
|
141
|
-
return (0, _react.css)(
|
|
141
|
+
return (0, _react.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n\t:not(.", ")\n\t\t.", ":not(.", ") {\n\t\t.", " {\n\t\t\tposition: relative;\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t.", ".", " {\n\t\t\tposition: relative;\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.HOVERED_DELETE_BUTTON, _types.TableCssClassName.HOVERED_CELL, _consts.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _consts.tableBorderColor);
|
|
142
142
|
};
|
|
143
143
|
|
|
144
144
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
145
|
-
var hoveredWarningCell = exports.hoveredWarningCell = (0, _react.css)(
|
|
145
|
+
var hoveredWarningCell = exports.hoveredWarningCell = (0, _react.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n\t:not(.", ")\n\t\t.", ":not(.", ") {\n\t\ttd.", " {\n\t\t\tbackground-color: ", " !important; /* We need to override the background-color added to the cell */\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.HOVERED_DELETE_BUTTON, _types.TableCssClassName.HOVERED_CELL_WARNING, "var(--ds-background-warning, ".concat(_colors.Y50, ")"), "var(--ds-border-warning, ".concat(_colors.Y200, ")"));
|
|
146
146
|
|
|
147
147
|
// Explicit pixel values required here to ensure correct positioning and sizes of column resize handle
|
|
148
148
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
149
149
|
var resizeLineStyles = function resizeLineStyles() {
|
|
150
|
-
return (0, _react.css)(
|
|
150
|
+
return (0, _react.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2.default)(["\n\t\tth.", "::before, td.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before,\n\t\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t/* Styles when drag and drop is disabled - will be removed */\n\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tleft: ", ";\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t\ttop: -", "px;\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tright: -1px;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t\ttop: -", "px;\n\t\t}\n\t"])), _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE_LAST_COLUMN, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _consts.tableToolbarSize + _styles.tableCellBorderWidth);
|
|
151
151
|
};
|
|
152
152
|
var resizeHandle = exports.resizeHandle = function resizeHandle() {
|
|
153
|
-
return (0, _react.css)(
|
|
153
|
+
return (0, _react.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\t.", " {\n\t\t\tbackground-color: transparent;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: 100%;\n\t\t\ttop: 0;\n\t\t\tright: -", "px;\n\t\t\tcursor: col-resize;\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\ttr\n\t\t\tth:last-child\n\t\t\t.", ",\n\t\t\ttr\n\t\t\ttd:last-child\n\t\t\t.", " {\n\t\t\tbackground-color: transparent;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: 100%;\n\t\t\ttop: 0;\n\t\t\tright: 0;\n\t\t\tcursor: col-resize;\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t", "\n\n\t\ttable\n tr:first-of-type\n th.", "\n .", "::after,\n table\n tr:first-of-type\n td.", "\n .", "::after,\n\t /* Styles when drag and drop is disabled - will be removed */\n\t\ttable\n tr:first-of-type\n th.", "\n .", "::after,\n table\n tr:first-of-type\n td.", "\n .", "::after {\n\t\t\ttop: -", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth, _consts.resizeHandlerAreaWidth / 2, _consts.resizeHandlerZIndex, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth / 2, _consts.resizeHandlerZIndex, resizeLineStyles(), _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _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);
|
|
154
154
|
};
|
|
155
155
|
|
|
156
156
|
// Drag and Drop: drop target insert line
|
|
@@ -188,5 +188,5 @@ var insertLineInactiveColor = (0, _react.css)({
|
|
|
188
188
|
// or column drag
|
|
189
189
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
190
190
|
var insertLine = exports.insertLine = function insertLine() {
|
|
191
|
-
return (0, _react.css)(
|
|
191
|
+
return (0, _react.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, _styles.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, _styles.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", insertLineActiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", insertLineInactiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", _styles.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", _styles.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, _styles.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, _styles.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor);
|
|
192
192
|
};
|
|
@@ -387,7 +387,9 @@ class TableComponent extends React.Component {
|
|
|
387
387
|
}
|
|
388
388
|
}
|
|
389
389
|
componentDidMount() {
|
|
390
|
-
if (editorExperiment('platform_editor_nodevisibility', false
|
|
390
|
+
if (editorExperiment('platform_editor_nodevisibility', false, {
|
|
391
|
+
exposure: true
|
|
392
|
+
})) {
|
|
391
393
|
this.initialiseEventListenersAfterMount();
|
|
392
394
|
return;
|
|
393
395
|
}
|
|
@@ -687,7 +689,7 @@ class TableComponent extends React.Component {
|
|
|
687
689
|
// Ignored via go/ees005
|
|
688
690
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
689
691
|
componentDidUpdate(_, prevState) {
|
|
690
|
-
var _this$props$
|
|
692
|
+
var _this$props$options0, _this$props$options1, _this$wrapper;
|
|
691
693
|
const {
|
|
692
694
|
view,
|
|
693
695
|
getNode,
|
|
@@ -719,7 +721,7 @@ class TableComponent extends React.Component {
|
|
|
719
721
|
shouldHandleColgroupUpdates = true;
|
|
720
722
|
}
|
|
721
723
|
const isTableScalingWithFixedColumnWidthsOptionEnabled = !!isTableScalingEnabled && tableWithFixedColumnWidthsOption;
|
|
722
|
-
const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled || !!isTableScalingEnabled && !!((_this$props$
|
|
724
|
+
const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled || !!isTableScalingEnabled && !!((_this$props$options0 = this.props.options) !== null && _this$props$options0 !== void 0 && _this$props$options0.isCommentEditor);
|
|
723
725
|
if (isTableScalingWithFixedColumnWidthsOptionEnabled && getNode().attrs.displayMode !== 'fixed') {
|
|
724
726
|
shouldScale = true;
|
|
725
727
|
shouldHandleColgroupUpdates = true;
|
|
@@ -730,7 +732,7 @@ class TableComponent extends React.Component {
|
|
|
730
732
|
if (isInDanger && !table) {
|
|
731
733
|
clearHoverSelection()(view.state, view.dispatch);
|
|
732
734
|
}
|
|
733
|
-
if ((_this$props$
|
|
735
|
+
if ((_this$props$options1 = this.props.options) !== null && _this$props$options1 !== void 0 && _this$props$options1.isCommentEditor && allowTableResizing && !(options !== null && options !== void 0 && options.isTableScalingEnabled)) {
|
|
734
736
|
this.removeInlineTableWidth();
|
|
735
737
|
}
|
|
736
738
|
if ((_this$wrapper = this.wrapper) !== null && _this$wrapper !== void 0 && _this$wrapper.parentElement && this.table && !this.overflowShadowsObserver) {
|
|
@@ -820,7 +822,7 @@ class TableComponent extends React.Component {
|
|
|
820
822
|
}
|
|
821
823
|
}
|
|
822
824
|
render() {
|
|
823
|
-
var _this$props$
|
|
825
|
+
var _this$props$options10;
|
|
824
826
|
const {
|
|
825
827
|
view,
|
|
826
828
|
getNode,
|
|
@@ -942,7 +944,7 @@ class TableComponent extends React.Component {
|
|
|
942
944
|
const {
|
|
943
945
|
tableWithFixedColumnWidthsOption = false
|
|
944
946
|
} = getEditorFeatureFlags();
|
|
945
|
-
const shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption || !!((_this$props$
|
|
947
|
+
const shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption || !!((_this$props$options10 = this.props.options) !== null && _this$props$options10 !== void 0 && _this$props$options10.isCommentEditor));
|
|
946
948
|
return /*#__PURE__*/React.createElement(TableContainer
|
|
947
949
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
948
950
|
, {
|
|
@@ -71,7 +71,9 @@ export default class TableRow extends TableNodeView {
|
|
|
71
71
|
this.isInNestedTable = getParentOfTypeCount(view.state.schema.nodes.table)(view.state.doc.resolve(pos)) > 1;
|
|
72
72
|
}
|
|
73
73
|
if (this.isHeaderRow) {
|
|
74
|
-
if (editorExperiment('platform_editor_nodevisibility', false
|
|
74
|
+
if (editorExperiment('platform_editor_nodevisibility', false, {
|
|
75
|
+
exposure: true
|
|
76
|
+
})) {
|
|
75
77
|
this.subscribeWhenRowVisible();
|
|
76
78
|
} else {
|
|
77
79
|
const {
|
|
@@ -397,7 +397,9 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
397
397
|
key: "componentDidMount",
|
|
398
398
|
value: function componentDidMount() {
|
|
399
399
|
var _this2 = this;
|
|
400
|
-
if (editorExperiment('platform_editor_nodevisibility', false
|
|
400
|
+
if (editorExperiment('platform_editor_nodevisibility', false, {
|
|
401
|
+
exposure: true
|
|
402
|
+
})) {
|
|
401
403
|
this.initialiseEventListenersAfterMount();
|
|
402
404
|
return;
|
|
403
405
|
}
|
|
@@ -604,14 +606,14 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
604
606
|
var _this$containerWidth,
|
|
605
607
|
_this4 = this;
|
|
606
608
|
var force = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
607
|
-
var _this$
|
|
608
|
-
getNode = _this$
|
|
609
|
-
containerWidth = _this$
|
|
610
|
-
isResizing = _this$
|
|
611
|
-
view = _this$
|
|
612
|
-
getPos = _this$
|
|
613
|
-
getEditorFeatureFlags = _this$
|
|
614
|
-
options = _this$
|
|
609
|
+
var _this$props0 = this.props,
|
|
610
|
+
getNode = _this$props0.getNode,
|
|
611
|
+
containerWidth = _this$props0.containerWidth,
|
|
612
|
+
isResizing = _this$props0.isResizing,
|
|
613
|
+
view = _this$props0.view,
|
|
614
|
+
getPos = _this$props0.getPos,
|
|
615
|
+
getEditorFeatureFlags = _this$props0.getEditorFeatureFlags,
|
|
616
|
+
options = _this$props0.options;
|
|
615
617
|
if (!this.table) {
|
|
616
618
|
return;
|
|
617
619
|
}
|
|
@@ -719,17 +721,17 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
719
721
|
_this$props$options9,
|
|
720
722
|
_this$wrapper,
|
|
721
723
|
_this5 = this;
|
|
722
|
-
var _this$
|
|
723
|
-
view = _this$
|
|
724
|
-
getNode = _this$
|
|
725
|
-
isMediaFullscreen = _this$
|
|
726
|
-
allowColumnResizing = _this$
|
|
727
|
-
allowTableResizing = _this$
|
|
728
|
-
isResizing = _this$
|
|
729
|
-
options = _this$
|
|
730
|
-
isTableScalingEnabled = _this$
|
|
731
|
-
getPos = _this$
|
|
732
|
-
getEditorFeatureFlags = _this$
|
|
724
|
+
var _this$props1 = this.props,
|
|
725
|
+
view = _this$props1.view,
|
|
726
|
+
getNode = _this$props1.getNode,
|
|
727
|
+
isMediaFullscreen = _this$props1.isMediaFullscreen,
|
|
728
|
+
allowColumnResizing = _this$props1.allowColumnResizing,
|
|
729
|
+
allowTableResizing = _this$props1.allowTableResizing,
|
|
730
|
+
isResizing = _this$props1.isResizing,
|
|
731
|
+
options = _this$props1.options,
|
|
732
|
+
isTableScalingEnabled = _this$props1.isTableScalingEnabled,
|
|
733
|
+
getPos = _this$props1.getPos,
|
|
734
|
+
getEditorFeatureFlags = _this$props1.getEditorFeatureFlags;
|
|
733
735
|
var isInDanger = this.props.isInDanger;
|
|
734
736
|
var table = findTable(view.state.selection);
|
|
735
737
|
if (!fg('platform_editor_table_use_shared_state_hook_fg')) {
|
|
@@ -847,33 +849,33 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
847
849
|
key: "render",
|
|
848
850
|
value: function render() {
|
|
849
851
|
var _this6 = this,
|
|
850
|
-
_this$props$
|
|
851
|
-
var _this$
|
|
852
|
-
view = _this$
|
|
853
|
-
getNode = _this$
|
|
854
|
-
isResizing = _this$
|
|
855
|
-
_this$
|
|
856
|
-
allowControls = _this$
|
|
857
|
-
isHeaderRowEnabled = _this$
|
|
858
|
-
ordering = _this$
|
|
859
|
-
isHeaderColumnEnabled = _this$
|
|
860
|
-
tableActive = _this$
|
|
861
|
-
containerWidth = _this$
|
|
862
|
-
options = _this$
|
|
863
|
-
getPos = _this$
|
|
864
|
-
pluginInjectionApi = _this$
|
|
865
|
-
isDragAndDropEnabled = _this$
|
|
866
|
-
getEditorFeatureFlags = _this$
|
|
867
|
-
isTableScalingEnabled = _this$
|
|
868
|
-
allowTableResizing = _this$
|
|
869
|
-
allowTableAlignment = _this$
|
|
870
|
-
selection = _this$
|
|
871
|
-
var _this$
|
|
872
|
-
isInDanger = _this$
|
|
873
|
-
hoveredRows = _this$
|
|
874
|
-
hoveredCell = _this$
|
|
875
|
-
isTableHovered = _this$
|
|
876
|
-
isWholeTableInDanger = _this$
|
|
852
|
+
_this$props$options0;
|
|
853
|
+
var _this$props10 = this.props,
|
|
854
|
+
view = _this$props10.view,
|
|
855
|
+
getNode = _this$props10.getNode,
|
|
856
|
+
isResizing = _this$props10.isResizing,
|
|
857
|
+
_this$props10$allowCo = _this$props10.allowControls,
|
|
858
|
+
allowControls = _this$props10$allowCo === void 0 ? true : _this$props10$allowCo,
|
|
859
|
+
isHeaderRowEnabled = _this$props10.isHeaderRowEnabled,
|
|
860
|
+
ordering = _this$props10.ordering,
|
|
861
|
+
isHeaderColumnEnabled = _this$props10.isHeaderColumnEnabled,
|
|
862
|
+
tableActive = _this$props10.tableActive,
|
|
863
|
+
containerWidth = _this$props10.containerWidth,
|
|
864
|
+
options = _this$props10.options,
|
|
865
|
+
getPos = _this$props10.getPos,
|
|
866
|
+
pluginInjectionApi = _this$props10.pluginInjectionApi,
|
|
867
|
+
isDragAndDropEnabled = _this$props10.isDragAndDropEnabled,
|
|
868
|
+
getEditorFeatureFlags = _this$props10.getEditorFeatureFlags,
|
|
869
|
+
isTableScalingEnabled = _this$props10.isTableScalingEnabled,
|
|
870
|
+
allowTableResizing = _this$props10.allowTableResizing,
|
|
871
|
+
allowTableAlignment = _this$props10.allowTableAlignment,
|
|
872
|
+
selection = _this$props10.selection;
|
|
873
|
+
var _this$props11 = this.props,
|
|
874
|
+
isInDanger = _this$props11.isInDanger,
|
|
875
|
+
hoveredRows = _this$props11.hoveredRows,
|
|
876
|
+
hoveredCell = _this$props11.hoveredCell,
|
|
877
|
+
isTableHovered = _this$props11.isTableHovered,
|
|
878
|
+
isWholeTableInDanger = _this$props11.isWholeTableInDanger;
|
|
877
879
|
var _this$state3 = this.state,
|
|
878
880
|
showBeforeShadow = _this$state3.showBeforeShadow,
|
|
879
881
|
showAfterShadow = _this$state3.showAfterShadow;
|
|
@@ -968,7 +970,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
968
970
|
var _getEditorFeatureFlag7 = getEditorFeatureFlags(),
|
|
969
971
|
_getEditorFeatureFlag8 = _getEditorFeatureFlag7.tableWithFixedColumnWidthsOption,
|
|
970
972
|
tableWithFixedColumnWidthsOption = _getEditorFeatureFlag8 === void 0 ? false : _getEditorFeatureFlag8;
|
|
971
|
-
var shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption || !!((_this$props$
|
|
973
|
+
var shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption || !!((_this$props$options0 = this.props.options) !== null && _this$props$options0 !== void 0 && _this$props$options0.isCommentEditor));
|
|
972
974
|
return /*#__PURE__*/React.createElement(TableContainer
|
|
973
975
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
974
976
|
, {
|
|
@@ -79,7 +79,9 @@ var TableRow = /*#__PURE__*/function (_TableNodeView) {
|
|
|
79
79
|
_this.isInNestedTable = getParentOfTypeCount(view.state.schema.nodes.table)(view.state.doc.resolve(pos)) > 1;
|
|
80
80
|
}
|
|
81
81
|
if (_this.isHeaderRow) {
|
|
82
|
-
if (editorExperiment('platform_editor_nodevisibility', false
|
|
82
|
+
if (editorExperiment('platform_editor_nodevisibility', false, {
|
|
83
|
+
exposure: true
|
|
84
|
+
})) {
|
|
83
85
|
_this.subscribeWhenRowVisible();
|
|
84
86
|
} else {
|
|
85
87
|
var _nodeVisibilityManage = nodeVisibilityManager(view.dom),
|
|
@@ -411,9 +411,9 @@ export var toggleNumberColumnWithAnalytics = function toggleNumberColumnWithAnal
|
|
|
411
411
|
export var sortColumnWithAnalytics = function sortColumnWithAnalytics(editorAnalyticsAPI) {
|
|
412
412
|
return function (inputMethod, columnIndex, sortOrder) {
|
|
413
413
|
return withEditorAnalyticsAPI(function (state) {
|
|
414
|
-
var
|
|
415
|
-
totalRowCount =
|
|
416
|
-
totalColumnCount =
|
|
414
|
+
var _getSelectedTableInfo0 = getSelectedTableInfo(state.selection),
|
|
415
|
+
totalRowCount = _getSelectedTableInfo0.totalRowCount,
|
|
416
|
+
totalColumnCount = _getSelectedTableInfo0.totalColumnCount;
|
|
417
417
|
return {
|
|
418
418
|
action: TABLE_ACTION.SORTED_COLUMN,
|
|
419
419
|
actionSubject: ACTION_SUBJECT.TABLE,
|
|
@@ -455,9 +455,9 @@ export var distributeColumnsWidthsWithAnalytics = function distributeColumnsWidt
|
|
|
455
455
|
};
|
|
456
456
|
export var wrapTableInExpandWithAnalytics = function wrapTableInExpandWithAnalytics(editorAnalyticsAPI) {
|
|
457
457
|
return withEditorAnalyticsAPI(function (state) {
|
|
458
|
-
var
|
|
459
|
-
totalRowCount =
|
|
460
|
-
totalColumnCount =
|
|
458
|
+
var _getSelectedTableInfo1 = getSelectedTableInfo(state.selection),
|
|
459
|
+
totalRowCount = _getSelectedTableInfo1.totalRowCount,
|
|
460
|
+
totalColumnCount = _getSelectedTableInfo1.totalColumnCount;
|
|
461
461
|
return {
|
|
462
462
|
action: TABLE_ACTION.COLLAPSED,
|
|
463
463
|
actionSubject: ACTION_SUBJECT.TABLE,
|
|
@@ -472,10 +472,10 @@ export var wrapTableInExpandWithAnalytics = function wrapTableInExpandWithAnalyt
|
|
|
472
472
|
};
|
|
473
473
|
export var toggleFixedColumnWidthsOptionAnalytics = function toggleFixedColumnWidthsOptionAnalytics(editorAnalyticsAPI, inputMethod) {
|
|
474
474
|
return withEditorAnalyticsAPI(function (state) {
|
|
475
|
-
var
|
|
476
|
-
table =
|
|
477
|
-
totalRowCount =
|
|
478
|
-
totalColumnCount =
|
|
475
|
+
var _getSelectedTableInfo10 = getSelectedTableInfo(state.selection),
|
|
476
|
+
table = _getSelectedTableInfo10.table,
|
|
477
|
+
totalRowCount = _getSelectedTableInfo10.totalRowCount,
|
|
478
|
+
totalColumnCount = _getSelectedTableInfo10.totalColumnCount;
|
|
479
479
|
var previousDisplayMode;
|
|
480
480
|
var newDisplayMode;
|
|
481
481
|
switch (table === null || table === void 0 ? void 0 : table.node.attrs.displayMode) {
|
|
@@ -510,10 +510,10 @@ export var toggleFixedColumnWidthsOptionAnalytics = function toggleFixedColumnWi
|
|
|
510
510
|
export var setTableAlignmentWithAnalytics = function setTableAlignmentWithAnalytics(editorAnalyticsAPI, isCommentEditor) {
|
|
511
511
|
return function (newAlignment, previousAlignment, inputMethod, reason) {
|
|
512
512
|
return withEditorAnalyticsAPI(function (state) {
|
|
513
|
-
var
|
|
514
|
-
table =
|
|
515
|
-
totalRowCount =
|
|
516
|
-
totalColumnCount =
|
|
513
|
+
var _getSelectedTableInfo11 = getSelectedTableInfo(state.selection),
|
|
514
|
+
table = _getSelectedTableInfo11.table,
|
|
515
|
+
totalRowCount = _getSelectedTableInfo11.totalRowCount,
|
|
516
|
+
totalColumnCount = _getSelectedTableInfo11.totalColumnCount;
|
|
517
517
|
return {
|
|
518
518
|
action: TABLE_ACTION.CHANGED_ALIGNMENT,
|
|
519
519
|
actionSubject: ACTION_SUBJECT.TABLE,
|
|
@@ -188,8 +188,8 @@ export var createPlugin = function createPlugin(api, nodeViewPortalProviderAPI)
|
|
|
188
188
|
var hoverTableMeta = tr.getMeta('mouseEnterTable');
|
|
189
189
|
if (hoverTableMeta) {
|
|
190
190
|
allTables = allTables.filter(function (_ref9) {
|
|
191
|
-
var
|
|
192
|
-
id =
|
|
191
|
+
var _ref0 = _slicedToArray(_ref9, 1),
|
|
192
|
+
id = _ref0[0];
|
|
193
193
|
return id !== hoverTableMeta[0];
|
|
194
194
|
});
|
|
195
195
|
allTables.push(hoverTableMeta);
|
|
@@ -209,10 +209,10 @@ export var createPlugin = function createPlugin(api, nodeViewPortalProviderAPI)
|
|
|
209
209
|
tableId = _table2[0],
|
|
210
210
|
node = _table2[1],
|
|
211
211
|
pos = _table2[2];
|
|
212
|
-
var
|
|
213
|
-
oldOrder =
|
|
214
|
-
oldDirection =
|
|
215
|
-
oldIndex =
|
|
212
|
+
var _ref1 = (oldPluginState === null || oldPluginState === void 0 || (_oldPluginState$sort = oldPluginState.sort) === null || _oldPluginState$sort === void 0 ? void 0 : _oldPluginState$sort[tableId]) || {},
|
|
213
|
+
oldOrder = _ref1.order,
|
|
214
|
+
oldDirection = _ref1.direction,
|
|
215
|
+
oldIndex = _ref1.index;
|
|
216
216
|
if (isChangesIncoming) {
|
|
217
217
|
var _maybeTableNode$attrs;
|
|
218
218
|
var maybeTableNode = tr.doc.nodeAt(pos);
|
|
@@ -252,10 +252,10 @@ export var createPlugin = function createPlugin(api, nodeViewPortalProviderAPI)
|
|
|
252
252
|
/**
|
|
253
253
|
* Sort the table if the sort order has changed
|
|
254
254
|
*/
|
|
255
|
-
var
|
|
256
|
-
newOrder =
|
|
257
|
-
newDirection =
|
|
258
|
-
newIndex =
|
|
255
|
+
var _ref10 = (newPluginState === null || newPluginState === void 0 || (_newPluginState$sort = newPluginState.sort) === null || _newPluginState$sort === void 0 ? void 0 : _newPluginState$sort[tableId]) || {},
|
|
256
|
+
newOrder = _ref10.order,
|
|
257
|
+
newDirection = _ref10.direction,
|
|
258
|
+
newIndex = _ref10.index;
|
|
259
259
|
var orderChanged = oldDirection !== newDirection || oldIndex !== newIndex;
|
|
260
260
|
if (orderChanged) {
|
|
261
261
|
if (!isRemote && newDirection !== SortOrder.NO_ORDER) {
|