@atlaskit/editor-plugin-table 7.16.8 → 7.16.9
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 +8 -0
- package/dist/cjs/nodeviews/ExternalDropTargets.js +4 -0
- package/dist/cjs/nodeviews/TableComponent.js +28 -5
- package/dist/cjs/nodeviews/TableContainer.js +32 -11
- package/dist/cjs/toolbar.js +17 -7
- package/dist/cjs/ui/ColumnResizeWidget/index.js +2 -0
- package/dist/cjs/ui/DragHandle/index.js +10 -3
- package/dist/cjs/ui/DragPreview/index.js +1 -0
- package/dist/cjs/ui/FloatingContextualButton/FixedButton.js +12 -1
- package/dist/cjs/ui/FloatingContextualButton/index.js +3 -1
- package/dist/cjs/ui/FloatingContextualMenu/ContextualMenu.js +7 -2
- package/dist/cjs/ui/FloatingDeleteButton/DeleteButton.js +7 -2
- package/dist/cjs/ui/FloatingDeleteButton/index.js +2 -0
- package/dist/cjs/ui/FloatingDragMenu/DragMenu.js +7 -2
- package/dist/cjs/ui/FloatingDragMenu/DropdownMenu.js +61 -57
- package/dist/cjs/ui/FloatingInsertButton/InsertButton.js +36 -14
- package/dist/cjs/ui/TableFloatingColumnControls/ColumnControls/index.js +22 -4
- package/dist/cjs/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.js +2 -0
- package/dist/cjs/ui/TableFloatingColumnControls/ColumnDropTargets/index.js +4 -1
- package/dist/cjs/ui/TableFloatingColumnControls/index.js +3 -1
- package/dist/cjs/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +12 -3
- package/dist/cjs/ui/TableFloatingControls/CornerControls/DragCornerControls.js +2 -0
- package/dist/cjs/ui/TableFloatingControls/NumberColumn/index.js +13 -4
- package/dist/cjs/ui/TableFloatingControls/RowControls/ClassicControls.js +50 -43
- package/dist/cjs/ui/TableFloatingControls/RowControls/DragControls.js +16 -2
- package/dist/cjs/ui/TableFloatingControls/RowDropTarget/index.js +3 -1
- package/dist/cjs/ui/TableFloatingControls/index.js +80 -76
- package/dist/cjs/ui/icons/DragHandleDisabledIcon.js +3 -1
- package/dist/cjs/ui/icons/DragInMotionIcon.js +3 -1
- package/dist/cjs/ui/icons/MinimisedHandle.js +1 -0
- package/dist/es2019/nodeviews/ExternalDropTargets.js +4 -0
- package/dist/es2019/nodeviews/TableComponent.js +28 -5
- package/dist/es2019/nodeviews/TableContainer.js +32 -11
- package/dist/es2019/toolbar.js +13 -3
- package/dist/es2019/ui/ColumnResizeWidget/index.js +2 -0
- package/dist/es2019/ui/DragHandle/index.js +10 -3
- package/dist/es2019/ui/DragPreview/index.js +1 -0
- package/dist/es2019/ui/FloatingContextualButton/FixedButton.js +12 -1
- package/dist/es2019/ui/FloatingContextualButton/index.js +3 -1
- package/dist/es2019/ui/FloatingContextualMenu/ContextualMenu.js +7 -2
- package/dist/es2019/ui/FloatingDeleteButton/DeleteButton.js +7 -2
- package/dist/es2019/ui/FloatingDeleteButton/index.js +2 -0
- package/dist/es2019/ui/FloatingDragMenu/DragMenu.js +7 -2
- package/dist/es2019/ui/FloatingDragMenu/DropdownMenu.js +56 -52
- package/dist/es2019/ui/FloatingInsertButton/InsertButton.js +36 -14
- package/dist/es2019/ui/TableFloatingColumnControls/ColumnControls/index.js +22 -4
- package/dist/es2019/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.js +2 -0
- package/dist/es2019/ui/TableFloatingColumnControls/ColumnDropTargets/index.js +4 -1
- package/dist/es2019/ui/TableFloatingColumnControls/index.js +3 -1
- package/dist/es2019/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +12 -3
- package/dist/es2019/ui/TableFloatingControls/CornerControls/DragCornerControls.js +2 -0
- package/dist/es2019/ui/TableFloatingControls/NumberColumn/index.js +13 -4
- package/dist/es2019/ui/TableFloatingControls/RowControls/ClassicControls.js +47 -40
- package/dist/es2019/ui/TableFloatingControls/RowControls/DragControls.js +16 -2
- package/dist/es2019/ui/TableFloatingControls/RowDropTarget/index.js +3 -1
- package/dist/es2019/ui/TableFloatingControls/index.js +78 -74
- package/dist/es2019/ui/icons/DragHandleDisabledIcon.js +3 -1
- package/dist/es2019/ui/icons/DragInMotionIcon.js +3 -1
- package/dist/es2019/ui/icons/MinimisedHandle.js +1 -0
- package/dist/esm/nodeviews/ExternalDropTargets.js +4 -0
- package/dist/esm/nodeviews/TableComponent.js +28 -5
- package/dist/esm/nodeviews/TableContainer.js +32 -11
- package/dist/esm/toolbar.js +16 -4
- package/dist/esm/ui/ColumnResizeWidget/index.js +2 -0
- package/dist/esm/ui/DragHandle/index.js +10 -3
- package/dist/esm/ui/DragPreview/index.js +1 -0
- package/dist/esm/ui/FloatingContextualButton/FixedButton.js +12 -1
- package/dist/esm/ui/FloatingContextualButton/index.js +3 -1
- package/dist/esm/ui/FloatingContextualMenu/ContextualMenu.js +7 -2
- package/dist/esm/ui/FloatingDeleteButton/DeleteButton.js +7 -2
- package/dist/esm/ui/FloatingDeleteButton/index.js +2 -0
- package/dist/esm/ui/FloatingDragMenu/DragMenu.js +7 -2
- package/dist/esm/ui/FloatingDragMenu/DropdownMenu.js +61 -57
- package/dist/esm/ui/FloatingInsertButton/InsertButton.js +36 -14
- package/dist/esm/ui/TableFloatingColumnControls/ColumnControls/index.js +22 -4
- package/dist/esm/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.js +2 -0
- package/dist/esm/ui/TableFloatingColumnControls/ColumnDropTargets/index.js +4 -1
- package/dist/esm/ui/TableFloatingColumnControls/index.js +3 -1
- package/dist/esm/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +12 -3
- package/dist/esm/ui/TableFloatingControls/CornerControls/DragCornerControls.js +2 -0
- package/dist/esm/ui/TableFloatingControls/NumberColumn/index.js +13 -4
- package/dist/esm/ui/TableFloatingControls/RowControls/ClassicControls.js +50 -43
- package/dist/esm/ui/TableFloatingControls/RowControls/DragControls.js +16 -2
- package/dist/esm/ui/TableFloatingControls/RowDropTarget/index.js +3 -1
- package/dist/esm/ui/TableFloatingControls/index.js +80 -76
- package/dist/esm/ui/icons/DragHandleDisabledIcon.js +3 -1
- package/dist/esm/ui/icons/DragInMotionIcon.js +3 -1
- package/dist/esm/ui/icons/MinimisedHandle.js +1 -0
- package/dist/types/toolbar.d.ts +2 -1
- package/dist/types-ts4.5/toolbar.d.ts +2 -1
- package/docs/0-intro.tsx +1 -0
- package/package.json +1 -1
- package/src/nodeviews/ExternalDropTargets.tsx +4 -0
- package/src/nodeviews/TableComponent.tsx +18 -0
- package/src/nodeviews/TableContainer.tsx +12 -0
- package/src/toolbar.tsx +20 -1
- package/src/ui/ColumnResizeWidget/index.tsx +2 -0
- package/src/ui/DragHandle/index.tsx +3 -0
- package/src/ui/DragPreview/index.tsx +1 -0
- package/src/ui/FloatingContextualButton/FixedButton.tsx +10 -0
- package/src/ui/FloatingContextualButton/index.tsx +1 -0
- package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +3 -0
- package/src/ui/FloatingDeleteButton/DeleteButton.tsx +4 -0
- package/src/ui/FloatingDeleteButton/index.tsx +2 -0
- package/src/ui/FloatingDragMenu/DragMenu.tsx +3 -0
- package/src/ui/FloatingDragMenu/DropdownMenu.tsx +3 -0
- package/src/ui/FloatingInsertButton/InsertButton.tsx +14 -0
- package/src/ui/TableFloatingColumnControls/ColumnControls/index.tsx +16 -1
- package/src/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.tsx +2 -0
- package/src/ui/TableFloatingColumnControls/ColumnDropTargets/index.tsx +2 -0
- package/src/ui/TableFloatingColumnControls/index.tsx +1 -0
- package/src/ui/TableFloatingControls/CornerControls/ClassicCornerControls.tsx +6 -0
- package/src/ui/TableFloatingControls/CornerControls/DragCornerControls.tsx +4 -0
- package/src/ui/TableFloatingControls/NumberColumn/index.tsx +5 -0
- package/src/ui/TableFloatingControls/RowControls/ClassicControls.tsx +5 -0
- package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +15 -1
- package/src/ui/TableFloatingControls/RowDropTarget/index.tsx +1 -0
- package/src/ui/TableFloatingControls/index.tsx +1 -0
- package/src/ui/icons/DragHandleDisabledIcon.tsx +1 -0
- package/src/ui/icons/DragInMotionIcon.tsx +1 -0
- package/src/ui/icons/MinimisedHandle.tsx +1 -0
|
@@ -75,12 +75,16 @@ var InsertButtonForDragAndDrop = exports.InsertButtonForDragAndDrop = function I
|
|
|
75
75
|
}),
|
|
76
76
|
position: "top"
|
|
77
77
|
}, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
78
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
78
79
|
className: (0, _classnames2.default)(_types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER, (_classnames = {}, (0, _defineProperty2.default)(_classnames, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER_ROW, isRow), (0, _defineProperty2.default)(_classnames, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER_COLUMN, !isRow), _classnames))
|
|
79
80
|
}, /*#__PURE__*/_react.default.createElement("button", {
|
|
80
|
-
type: "button"
|
|
81
|
+
type: "button"
|
|
82
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
83
|
+
,
|
|
81
84
|
className: _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON,
|
|
82
85
|
onMouseDown: onMouseDown
|
|
83
86
|
}, /*#__PURE__*/_react.default.createElement("svg", {
|
|
87
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
84
88
|
className: _types.TableCssClassName.CONTROLS_BUTTON_ICON,
|
|
85
89
|
width: "16",
|
|
86
90
|
height: "16",
|
|
@@ -91,7 +95,10 @@ var InsertButtonForDragAndDrop = exports.InsertButtonForDragAndDrop = function I
|
|
|
91
95
|
d: "M8 4C7.44771 4 7 4.44771 7 5V7H5C4.44771 7 4 7.44771 4 8C4 8.55229 4.44771 9 5 9H7V11C7 11.5523 7.44771 12 8 12C8.55229 12 9 11.5523 9 11V9H11C11.5523 9 12 8.55229 12 8C12 7.44771 11.5523 7 11 7H9V5C9 4.44771 8.55229 4 8 4Z",
|
|
92
96
|
fill: "currentColor"
|
|
93
97
|
})))), /*#__PURE__*/_react.default.createElement("div", {
|
|
94
|
-
|
|
98
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
99
|
+
className: _types.TableCssClassName.CONTROLS_INSERT_LINE
|
|
100
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
101
|
+
,
|
|
95
102
|
style: type === 'row' ? {
|
|
96
103
|
width: getInsertLineWidth(tableRef, true),
|
|
97
104
|
left: "var(--ds-space-150, 12px)"
|
|
@@ -102,11 +109,16 @@ var InsertButtonForDragAndDrop = exports.InsertButtonForDragAndDrop = function I
|
|
|
102
109
|
}
|
|
103
110
|
})));
|
|
104
111
|
var floatingButtonClassName = isRow ? _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_ROW : _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_COLUMN;
|
|
105
|
-
return
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
112
|
+
return (
|
|
113
|
+
/*#__PURE__*/
|
|
114
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
115
|
+
_react.default.createElement("div", {
|
|
116
|
+
className: floatingButtonClassName
|
|
117
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
118
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
119
|
+
className: "".concat(_types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_WRAP, " ").concat(_types.TableCssClassName.CONTROLS_INSERT_ROW)
|
|
120
|
+
}, content))
|
|
121
|
+
);
|
|
110
122
|
};
|
|
111
123
|
var DragAndDropInsertButton = exports.DragAndDropInsertButton = (0, _reactIntlNext.injectIntl)(InsertButtonForDragAndDrop);
|
|
112
124
|
var InsertButton = function InsertButton(_ref3) {
|
|
@@ -124,7 +136,9 @@ var InsertButton = function InsertButton(_ref3) {
|
|
|
124
136
|
}, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
125
137
|
className: _types.TableCssClassName.CONTROLS_INSERT_BUTTON_INNER
|
|
126
138
|
}, /*#__PURE__*/_react.default.createElement("button", {
|
|
127
|
-
type: "button"
|
|
139
|
+
type: "button"
|
|
140
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
141
|
+
,
|
|
128
142
|
className: _types.TableCssClassName.CONTROLS_INSERT_BUTTON,
|
|
129
143
|
onMouseDown: onMouseDown
|
|
130
144
|
}, /*#__PURE__*/_react.default.createElement("svg", {
|
|
@@ -134,7 +148,10 @@ var InsertButton = function InsertButton(_ref3) {
|
|
|
134
148
|
fill: "currentColor",
|
|
135
149
|
fillRule: "evenodd"
|
|
136
150
|
})))), /*#__PURE__*/_react.default.createElement("div", {
|
|
137
|
-
|
|
151
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
152
|
+
className: _types.TableCssClassName.CONTROLS_INSERT_LINE
|
|
153
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
154
|
+
,
|
|
138
155
|
style: type === 'row' ? {
|
|
139
156
|
width: getInsertLineWidth(tableRef)
|
|
140
157
|
} : {
|
|
@@ -142,10 +159,15 @@ var InsertButton = function InsertButton(_ref3) {
|
|
|
142
159
|
}
|
|
143
160
|
})));
|
|
144
161
|
var floatingButtonClassName = type === 'column' ? _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_COLUMN : _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_ROW;
|
|
145
|
-
return
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
162
|
+
return (
|
|
163
|
+
/*#__PURE__*/
|
|
164
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
165
|
+
_react.default.createElement("div", {
|
|
166
|
+
className: floatingButtonClassName
|
|
167
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
168
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
169
|
+
className: "".concat(_types.TableCssClassName.CONTROLS_INSERT_BUTTON_WRAP, " ").concat(_types.TableCssClassName.CONTROLS_INSERT_ROW)
|
|
170
|
+
}, content))
|
|
171
|
+
);
|
|
150
172
|
};
|
|
151
173
|
var _default = exports.default = (0, _reactIntlNext.injectIntl)(InsertButton);
|
|
@@ -138,14 +138,23 @@ var ColumnControls = exports.ColumnControls = function ColumnControls(_ref) {
|
|
|
138
138
|
key: type,
|
|
139
139
|
style: {
|
|
140
140
|
gridColumn: gridColumn,
|
|
141
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
141
142
|
gridRow: '1',
|
|
143
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
142
144
|
display: 'flex',
|
|
145
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
143
146
|
justifyContent: 'center',
|
|
147
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
144
148
|
alignItems: 'center',
|
|
149
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
145
150
|
height: 'fit-content',
|
|
151
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
146
152
|
placeSelf: 'center',
|
|
153
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
147
154
|
zIndex: 99,
|
|
155
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
148
156
|
width: '100%',
|
|
157
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
149
158
|
position: 'relative'
|
|
150
159
|
},
|
|
151
160
|
"data-testid": "table-floating-column-".concat(isHover ? colIndex : isPlaceholder ? appearance : selectedColIndexes[0], "-drag-handle")
|
|
@@ -187,15 +196,19 @@ var ColumnControls = exports.ColumnControls = function ColumnControls(_ref) {
|
|
|
187
196
|
};
|
|
188
197
|
var containerWidth = isNumberColumnEnabled && tableContainerWidth ? tableContainerWidth - _editorSharedStyles.akEditorTableNumberColumnWidth : tableContainerWidth;
|
|
189
198
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
199
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
190
200
|
className: _types.TableCssClassName.DRAG_COLUMN_CONTROLS,
|
|
191
201
|
onMouseMove: handleMouseMove
|
|
192
202
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
193
|
-
ref: columnControlsRef
|
|
203
|
+
ref: columnControlsRef
|
|
204
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
205
|
+
,
|
|
194
206
|
className: _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER,
|
|
195
207
|
"data-testid": "table-floating-column-controls",
|
|
196
208
|
style: {
|
|
209
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
197
210
|
gridTemplateColumns: widths,
|
|
198
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
211
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
199
212
|
marginTop: marginTop,
|
|
200
213
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
201
214
|
width: stickyTop ? containerWidth : undefined,
|
|
@@ -210,12 +223,17 @@ var ColumnControls = exports.ColumnControls = function ColumnControls(_ref) {
|
|
|
210
223
|
gridColumn: "".concat(startIndex + 1, " / span 1")
|
|
211
224
|
},
|
|
212
225
|
"data-start-index": startIndex,
|
|
213
|
-
"data-end-index": endIndex
|
|
226
|
+
"data-end-index": endIndex
|
|
227
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
228
|
+
,
|
|
214
229
|
className: _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER,
|
|
215
230
|
contentEditable: false,
|
|
216
231
|
key: index
|
|
217
232
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
218
|
-
|
|
233
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
234
|
+
className: _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT
|
|
235
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
236
|
+
,
|
|
219
237
|
style: columnParams.length - 1 === index ? {
|
|
220
238
|
right: '0'
|
|
221
239
|
} : {}
|
|
@@ -89,7 +89,9 @@ var ColumnDropTarget = exports.ColumnDropTarget = function ColumnDropTarget(_ref
|
|
|
89
89
|
height: height && "".concat(height, "px"),
|
|
90
90
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
91
91
|
marginTop: marginTop && "".concat(marginTop, "px"),
|
|
92
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
92
93
|
pointerEvents: 'auto',
|
|
94
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
93
95
|
flexShrink: 0
|
|
94
96
|
},
|
|
95
97
|
"data-drop-target-index": index,
|
|
@@ -26,10 +26,13 @@ var ColumnDropTargets = exports.ColumnDropTargets = function ColumnDropTargets(_
|
|
|
26
26
|
dropTargetRef.current.style.marginLeft = "-".concat((_getScrollOffset = getScrollOffset === null || getScrollOffset === void 0 ? void 0 : getScrollOffset()) !== null && _getScrollOffset !== void 0 ? _getScrollOffset : 0, "px");
|
|
27
27
|
}
|
|
28
28
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
29
|
-
ref: dropTargetRef
|
|
29
|
+
ref: dropTargetRef
|
|
30
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
31
|
+
,
|
|
30
32
|
className: _types.TableCssClassName.DRAG_COLUMN_DROP_TARGET_CONTROLS,
|
|
31
33
|
contentEditable: false
|
|
32
34
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
35
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
33
36
|
className: _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER,
|
|
34
37
|
"data-testid": "table-floating-column-controls-drop-targets"
|
|
35
38
|
}, colWidths === null || colWidths === void 0 ? void 0 : colWidths.map(function (width, index) {
|
|
@@ -81,7 +81,9 @@ var TableFloatingColumnControls = exports.TableFloatingColumnControls = function
|
|
|
81
81
|
containerRef === null || containerRef === void 0 || (_containerRef$current2 = containerRef.current) === null || _containerRef$current2 === void 0 || _containerRef$current2.style.removeProperty('top');
|
|
82
82
|
}
|
|
83
83
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
84
|
-
ref: containerRef
|
|
84
|
+
ref: containerRef
|
|
85
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
86
|
+
,
|
|
85
87
|
className: _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER,
|
|
86
88
|
"data-testid": "table-floating-column-controls-wrapper"
|
|
87
89
|
}, /*#__PURE__*/_react.default.createElement(_ColumnControls.ColumnControls, {
|
|
@@ -81,6 +81,7 @@ var CornerControlComponent = /*#__PURE__*/function (_Component) {
|
|
|
81
81
|
}
|
|
82
82
|
var isActive = this.isActive();
|
|
83
83
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
84
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
84
85
|
className: (0, _classnames.default)(_types.TableCssClassName.CORNER_CONTROLS, {
|
|
85
86
|
active: isActive,
|
|
86
87
|
sticky: this.props.stickyTop !== undefined
|
|
@@ -92,18 +93,26 @@ var CornerControlComponent = /*#__PURE__*/function (_Component) {
|
|
|
92
93
|
contentEditable: false
|
|
93
94
|
}, /*#__PURE__*/_react.default.createElement("button", {
|
|
94
95
|
"aria-label": formatMessage(_messages.tableMessages.cornerControl),
|
|
95
|
-
type: "button"
|
|
96
|
+
type: "button"
|
|
97
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
98
|
+
,
|
|
96
99
|
className: (0, _classnames.default)(_types.TableCssClassName.CONTROLS_CORNER_BUTTON, {
|
|
97
100
|
danger: isActive && isInDanger
|
|
98
101
|
}),
|
|
99
102
|
onClick: this.selectTable,
|
|
100
103
|
onMouseOver: this.hoverTable,
|
|
101
104
|
onMouseOut: this.clearHoverSelection
|
|
102
|
-
}), !isHeaderRowEnabled &&
|
|
105
|
+
}), !isHeaderRowEnabled &&
|
|
106
|
+
/*#__PURE__*/
|
|
107
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
108
|
+
_react.default.createElement("div", {
|
|
103
109
|
className: _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER
|
|
104
110
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
105
111
|
className: _types.TableCssClassName.CONTROLS_INSERT_MARKER
|
|
106
|
-
})), !isHeaderColumnEnabled &&
|
|
112
|
+
})), !isHeaderColumnEnabled &&
|
|
113
|
+
/*#__PURE__*/
|
|
114
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
115
|
+
_react.default.createElement("div", {
|
|
107
116
|
className: _types.TableCssClassName.CORNER_CONTROLS_INSERT_COLUMN_MARKER
|
|
108
117
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
109
118
|
className: _types.TableCssClassName.CONTROLS_INSERT_MARKER
|
|
@@ -43,6 +43,7 @@ var DragCornerControlsComponent = function DragCornerControlsComponent(_ref) {
|
|
|
43
43
|
return null;
|
|
44
44
|
}
|
|
45
45
|
return /*#__PURE__*/_react.default.createElement("button", {
|
|
46
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
46
47
|
className: (0, _classnames.default)(_types.TableCssClassName.DRAG_CORNER_BUTTON, {
|
|
47
48
|
active: isActive,
|
|
48
49
|
danger: isActive && isInDanger
|
|
@@ -88,6 +89,7 @@ var DragCornerControlsComponentWithSelection = function DragCornerControlsCompon
|
|
|
88
89
|
return null;
|
|
89
90
|
}
|
|
90
91
|
return /*#__PURE__*/_react.default.createElement("button", {
|
|
92
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
91
93
|
className: (0, _classnames.default)(_types.TableCssClassName.DRAG_CORNER_BUTTON, {
|
|
92
94
|
active: isActive,
|
|
93
95
|
danger: isActive && isInDanger
|
|
@@ -110,6 +110,7 @@ var NumberColumn = exports.default = /*#__PURE__*/function (_Component) {
|
|
|
110
110
|
updateCellHoverLocation = _this$props5.updateCellHoverLocation;
|
|
111
111
|
var rowHeights = (0, _utils2.getRowHeights)(tableRef);
|
|
112
112
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
113
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
113
114
|
className: _types.TableCssClassName.NUMBERED_COLUMN,
|
|
114
115
|
style: {
|
|
115
116
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
@@ -119,17 +120,25 @@ var NumberColumn = exports.default = /*#__PURE__*/function (_Component) {
|
|
|
119
120
|
contentEditable: false
|
|
120
121
|
}, rowHeights.map(function (rowHeight, index) {
|
|
121
122
|
return isDragAndDropEnabled ? /*#__PURE__*/_react.default.createElement("div", {
|
|
122
|
-
key: "wrapper-".concat(index)
|
|
123
|
+
key: "wrapper-".concat(index)
|
|
124
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
125
|
+
,
|
|
123
126
|
className: _this2.getClassNames(index, true),
|
|
124
|
-
"data-index": index
|
|
127
|
+
"data-index": index
|
|
128
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
129
|
+
,
|
|
125
130
|
style: _this2.getCellStyles(index, rowHeight),
|
|
126
131
|
onMouseOver: function onMouseOver() {
|
|
127
132
|
return updateCellHoverLocation(index);
|
|
128
133
|
}
|
|
129
134
|
}, hasHeaderRow ? index > 0 ? index : null : index + 1) : /*#__PURE__*/_react.default.createElement("div", {
|
|
130
|
-
key: "wrapper-".concat(index)
|
|
135
|
+
key: "wrapper-".concat(index)
|
|
136
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
137
|
+
,
|
|
131
138
|
className: _this2.getClassNames(index),
|
|
132
|
-
"data-index": index
|
|
139
|
+
"data-index": index
|
|
140
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
141
|
+
,
|
|
133
142
|
style: _this2.getCellStyles(index, rowHeight),
|
|
134
143
|
onClick: function onClick(event) {
|
|
135
144
|
return _this2.selectRow(index, event);
|
|
@@ -62,50 +62,57 @@ var RowControlsComponent = /*#__PURE__*/function (_Component) {
|
|
|
62
62
|
var rowsParams = (0, _utils.getRowsParams)(rowHeights);
|
|
63
63
|
var firstRow = tableRef.querySelector('tr');
|
|
64
64
|
var hasHeaderRow = firstRow ? firstRow.getAttribute('data-header-row') : false;
|
|
65
|
-
return
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
className: "".concat(_types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, " ").concat((0, _utils.getRowClassNames)(startIndex, selectionState || selection, hoveredRows, isInDanger, isResizing), " ").concat(thisRowSticky ? 'sticky' : ''),
|
|
81
|
-
key: startIndex,
|
|
82
|
-
style: {
|
|
83
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
84
|
-
height: height,
|
|
85
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
86
|
-
marginTop: "".concat(marginTop, "px"),
|
|
87
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
88
|
-
top: thisRowSticky ? "".concat(_this2.props.stickyTop + 3, "px") : undefined,
|
|
89
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
90
|
-
paddingTop: thisRowSticky ? "".concat(_consts.tableControlsSpacing, "px") : undefined
|
|
65
|
+
return (
|
|
66
|
+
/*#__PURE__*/
|
|
67
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
68
|
+
_react.default.createElement("div", {
|
|
69
|
+
className: _types.TableCssClassName.ROW_CONTROLS
|
|
70
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
71
|
+
className: _types.TableCssClassName.ROW_CONTROLS_INNER
|
|
72
|
+
}, rowsParams.map(function (_ref, index) {
|
|
73
|
+
var startIndex = _ref.startIndex,
|
|
74
|
+
endIndex = _ref.endIndex,
|
|
75
|
+
height = _ref.height;
|
|
76
|
+
// if previous row was header row, add its height to our margin
|
|
77
|
+
var marginTop = -1;
|
|
78
|
+
if (index === 1 && hasHeaderRow && _this2.props.stickyTop !== undefined) {
|
|
79
|
+
marginTop += rowHeights[index - 1] + _consts.tableToolbarSize;
|
|
91
80
|
}
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
81
|
+
var thisRowSticky = _this2.props.stickyTop !== undefined && index === 0 && hasHeaderRow;
|
|
82
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
83
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
84
|
+
className: "".concat(_types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, " ").concat((0, _utils.getRowClassNames)(startIndex, selectionState || selection, hoveredRows, isInDanger, isResizing), " ").concat(thisRowSticky ? 'sticky' : ''),
|
|
85
|
+
key: startIndex,
|
|
86
|
+
style: {
|
|
87
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
88
|
+
height: height,
|
|
89
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
90
|
+
marginTop: "".concat(marginTop, "px"),
|
|
91
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
92
|
+
top: thisRowSticky ? "".concat(_this2.props.stickyTop + 3, "px") : undefined,
|
|
93
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
94
|
+
paddingTop: thisRowSticky ? "".concat(_consts.tableControlsSpacing, "px") : undefined
|
|
95
|
+
}
|
|
96
|
+
}, /*#__PURE__*/_react.default.createElement("button", {
|
|
97
|
+
"aria-label": formatMessage(_messages.tableMessages.rowControl),
|
|
98
|
+
type: "button"
|
|
99
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
100
|
+
,
|
|
101
|
+
className: "".concat(_types.TableCssClassName.ROW_CONTROLS_BUTTON, " ").concat(_types.TableCssClassName.CONTROLS_BUTTON),
|
|
102
|
+
onClick: function onClick(event) {
|
|
103
|
+
return _this2.props.selectRow(startIndex, event.shiftKey);
|
|
104
|
+
},
|
|
105
|
+
onMouseOver: function onMouseOver() {
|
|
106
|
+
return _this2.props.hoverRows([startIndex]);
|
|
107
|
+
},
|
|
108
|
+
onMouseOut: _this2.clearHoverSelection,
|
|
109
|
+
"data-start-index": startIndex,
|
|
110
|
+
"data-end-index": endIndex
|
|
111
|
+
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
112
|
+
className: _types.TableCssClassName.CONTROLS_INSERT_MARKER
|
|
113
|
+
}));
|
|
114
|
+
})))
|
|
115
|
+
);
|
|
109
116
|
}
|
|
110
117
|
}]);
|
|
111
118
|
return RowControlsComponent;
|
|
@@ -146,13 +146,18 @@ var DragControlsComponent = function DragControlsComponent(_ref) {
|
|
|
146
146
|
key: type,
|
|
147
147
|
style: {
|
|
148
148
|
gridRow: gridRow,
|
|
149
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
149
150
|
gridColumn: '2',
|
|
150
151
|
// DragHandle uses `transform: rotate(90)`, which doesn't affect its parent (this div) causing the width of this element to be the true height of the drag handle
|
|
152
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
151
153
|
display: 'flex',
|
|
154
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
152
155
|
width: '9px',
|
|
156
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
153
157
|
height: '100%',
|
|
158
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
154
159
|
position: 'relative',
|
|
155
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
160
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
156
161
|
right: '-0.5px'
|
|
157
162
|
},
|
|
158
163
|
"data-testid": "table-floating-row-".concat(isHover ? rowIndex : selectedRowIndexes[0], "-drag-handle")
|
|
@@ -193,6 +198,7 @@ var DragControlsComponent = function DragControlsComponent(_ref) {
|
|
|
193
198
|
return null;
|
|
194
199
|
}
|
|
195
200
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
201
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
196
202
|
className: _types.TableCssClassName.DRAG_ROW_CONTROLS,
|
|
197
203
|
style: {
|
|
198
204
|
gridTemplateRows: heights,
|
|
@@ -210,10 +216,13 @@ var DragControlsComponent = function DragControlsComponent(_ref) {
|
|
|
210
216
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
211
217
|
style: {
|
|
212
218
|
gridRow: "".concat(index + 1, " / span 1"),
|
|
219
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
213
220
|
gridColumn: '2'
|
|
214
221
|
},
|
|
215
222
|
"data-start-index": startIndex,
|
|
216
|
-
"data-end-index": endIndex
|
|
223
|
+
"data-end-index": endIndex
|
|
224
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
225
|
+
,
|
|
217
226
|
className: _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER,
|
|
218
227
|
contentEditable: false,
|
|
219
228
|
key: "insert-dot-".concat(index)
|
|
@@ -224,11 +233,16 @@ var DragControlsComponent = function DragControlsComponent(_ref) {
|
|
|
224
233
|
index: index,
|
|
225
234
|
localId: currentNodeLocalId,
|
|
226
235
|
style: {
|
|
236
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
227
237
|
gridColumn: '1 / span 3',
|
|
228
238
|
gridRow: "".concat(index + 1, " / span 1"),
|
|
239
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
229
240
|
height: '100%',
|
|
241
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
230
242
|
pointerEvents: 'auto',
|
|
243
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
231
244
|
position: 'relative',
|
|
245
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
232
246
|
left: "var(--ds-space-negative-100, -8px)"
|
|
233
247
|
}
|
|
234
248
|
}));
|
|
@@ -79,7 +79,9 @@ var RowDropTarget = function RowDropTarget(_ref) {
|
|
|
79
79
|
});
|
|
80
80
|
}, [index, localId]);
|
|
81
81
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
82
|
-
ref: dropTargetRef
|
|
82
|
+
ref: dropTargetRef
|
|
83
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
84
|
+
,
|
|
83
85
|
style: style,
|
|
84
86
|
"data-drop-target-index": index,
|
|
85
87
|
"data-drop-target-localid": localId,
|