@atlaskit/editor-plugin-table 10.11.4 → 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 +6 -0
- package/dist/cjs/nodeviews/ExternalDropTargets.js +1 -2
- package/dist/cjs/nodeviews/TableComponent.js +47 -47
- package/dist/cjs/nodeviews/TableContainer.js +1 -2
- package/dist/cjs/nodeviews/TableResizer.js +1 -2
- 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 +5 -5
- package/dist/esm/nodeviews/TableComponent.js +47 -47
- 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 +3 -3
- package/src/nodeviews/TableComponent.tsx +3 -3
- package/src/nodeviews/TableRow.ts +2 -2
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
|
};
|
|
@@ -689,7 +689,7 @@ class TableComponent extends React.Component {
|
|
|
689
689
|
// Ignored via go/ees005
|
|
690
690
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
691
691
|
componentDidUpdate(_, prevState) {
|
|
692
|
-
var _this$props$
|
|
692
|
+
var _this$props$options0, _this$props$options1, _this$wrapper;
|
|
693
693
|
const {
|
|
694
694
|
view,
|
|
695
695
|
getNode,
|
|
@@ -721,7 +721,7 @@ class TableComponent extends React.Component {
|
|
|
721
721
|
shouldHandleColgroupUpdates = true;
|
|
722
722
|
}
|
|
723
723
|
const isTableScalingWithFixedColumnWidthsOptionEnabled = !!isTableScalingEnabled && tableWithFixedColumnWidthsOption;
|
|
724
|
-
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);
|
|
725
725
|
if (isTableScalingWithFixedColumnWidthsOptionEnabled && getNode().attrs.displayMode !== 'fixed') {
|
|
726
726
|
shouldScale = true;
|
|
727
727
|
shouldHandleColgroupUpdates = true;
|
|
@@ -732,7 +732,7 @@ class TableComponent extends React.Component {
|
|
|
732
732
|
if (isInDanger && !table) {
|
|
733
733
|
clearHoverSelection()(view.state, view.dispatch);
|
|
734
734
|
}
|
|
735
|
-
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)) {
|
|
736
736
|
this.removeInlineTableWidth();
|
|
737
737
|
}
|
|
738
738
|
if ((_this$wrapper = this.wrapper) !== null && _this$wrapper !== void 0 && _this$wrapper.parentElement && this.table && !this.overflowShadowsObserver) {
|
|
@@ -822,7 +822,7 @@ class TableComponent extends React.Component {
|
|
|
822
822
|
}
|
|
823
823
|
}
|
|
824
824
|
render() {
|
|
825
|
-
var _this$props$
|
|
825
|
+
var _this$props$options10;
|
|
826
826
|
const {
|
|
827
827
|
view,
|
|
828
828
|
getNode,
|
|
@@ -944,7 +944,7 @@ class TableComponent extends React.Component {
|
|
|
944
944
|
const {
|
|
945
945
|
tableWithFixedColumnWidthsOption = false
|
|
946
946
|
} = getEditorFeatureFlags();
|
|
947
|
-
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));
|
|
948
948
|
return /*#__PURE__*/React.createElement(TableContainer
|
|
949
949
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
950
950
|
, {
|
|
@@ -606,14 +606,14 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
606
606
|
var _this$containerWidth,
|
|
607
607
|
_this4 = this;
|
|
608
608
|
var force = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
609
|
-
var _this$
|
|
610
|
-
getNode = _this$
|
|
611
|
-
containerWidth = _this$
|
|
612
|
-
isResizing = _this$
|
|
613
|
-
view = _this$
|
|
614
|
-
getPos = _this$
|
|
615
|
-
getEditorFeatureFlags = _this$
|
|
616
|
-
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;
|
|
617
617
|
if (!this.table) {
|
|
618
618
|
return;
|
|
619
619
|
}
|
|
@@ -721,17 +721,17 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
721
721
|
_this$props$options9,
|
|
722
722
|
_this$wrapper,
|
|
723
723
|
_this5 = this;
|
|
724
|
-
var _this$
|
|
725
|
-
view = _this$
|
|
726
|
-
getNode = _this$
|
|
727
|
-
isMediaFullscreen = _this$
|
|
728
|
-
allowColumnResizing = _this$
|
|
729
|
-
allowTableResizing = _this$
|
|
730
|
-
isResizing = _this$
|
|
731
|
-
options = _this$
|
|
732
|
-
isTableScalingEnabled = _this$
|
|
733
|
-
getPos = _this$
|
|
734
|
-
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;
|
|
735
735
|
var isInDanger = this.props.isInDanger;
|
|
736
736
|
var table = findTable(view.state.selection);
|
|
737
737
|
if (!fg('platform_editor_table_use_shared_state_hook_fg')) {
|
|
@@ -849,33 +849,33 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
849
849
|
key: "render",
|
|
850
850
|
value: function render() {
|
|
851
851
|
var _this6 = this,
|
|
852
|
-
_this$props$
|
|
853
|
-
var _this$
|
|
854
|
-
view = _this$
|
|
855
|
-
getNode = _this$
|
|
856
|
-
isResizing = _this$
|
|
857
|
-
_this$
|
|
858
|
-
allowControls = _this$
|
|
859
|
-
isHeaderRowEnabled = _this$
|
|
860
|
-
ordering = _this$
|
|
861
|
-
isHeaderColumnEnabled = _this$
|
|
862
|
-
tableActive = _this$
|
|
863
|
-
containerWidth = _this$
|
|
864
|
-
options = _this$
|
|
865
|
-
getPos = _this$
|
|
866
|
-
pluginInjectionApi = _this$
|
|
867
|
-
isDragAndDropEnabled = _this$
|
|
868
|
-
getEditorFeatureFlags = _this$
|
|
869
|
-
isTableScalingEnabled = _this$
|
|
870
|
-
allowTableResizing = _this$
|
|
871
|
-
allowTableAlignment = _this$
|
|
872
|
-
selection = _this$
|
|
873
|
-
var _this$
|
|
874
|
-
isInDanger = _this$
|
|
875
|
-
hoveredRows = _this$
|
|
876
|
-
hoveredCell = _this$
|
|
877
|
-
isTableHovered = _this$
|
|
878
|
-
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;
|
|
879
879
|
var _this$state3 = this.state,
|
|
880
880
|
showBeforeShadow = _this$state3.showBeforeShadow,
|
|
881
881
|
showAfterShadow = _this$state3.showAfterShadow;
|
|
@@ -970,7 +970,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
970
970
|
var _getEditorFeatureFlag7 = getEditorFeatureFlags(),
|
|
971
971
|
_getEditorFeatureFlag8 = _getEditorFeatureFlag7.tableWithFixedColumnWidthsOption,
|
|
972
972
|
tableWithFixedColumnWidthsOption = _getEditorFeatureFlag8 === void 0 ? false : _getEditorFeatureFlag8;
|
|
973
|
-
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));
|
|
974
974
|
return /*#__PURE__*/React.createElement(TableContainer
|
|
975
975
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
976
976
|
, {
|
|
@@ -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) {
|