@atlaskit/editor-plugin-table 10.11.4 → 10.11.6
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 +15 -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/table-node-views.js +34 -0
- package/dist/cjs/pm-plugins/commands/commands-with-analytics.js +14 -14
- package/dist/cjs/pm-plugins/main.js +5 -5
- 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/es2019/nodeviews/table-node-views.js +26 -0
- package/dist/es2019/pm-plugins/main.js +5 -5
- package/dist/esm/nodeviews/TableComponent.js +47 -47
- package/dist/esm/nodeviews/table-node-views.js +26 -0
- package/dist/esm/pm-plugins/commands/commands-with-analytics.js +14 -14
- package/dist/esm/pm-plugins/main.js +5 -5
- 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/dist/{types-ts4.5/nodeviews/lazy-node-views.d.ts → types/nodeviews/table-node-views.d.ts} +4 -4
- package/dist/{types/nodeviews/lazy-node-views.d.ts → types-ts4.5/nodeviews/table-node-views.d.ts} +4 -4
- package/package.json +3 -9
- package/src/nodeviews/TableComponent.tsx +3 -3
- package/src/nodeviews/TableRow.ts +2 -2
- package/src/nodeviews/table-node-views.ts +76 -0
- package/src/pm-plugins/main.ts +9 -9
- package/dist/cjs/nodeviews/lazy-node-views.js +0 -149
- package/dist/es2019/nodeviews/lazy-node-views.js +0 -132
- package/dist/esm/nodeviews/lazy-node-views.js +0 -132
- package/src/nodeviews/lazy-node-views.ts +0 -246
package/dist/esm/tablePlugin.js
CHANGED
|
@@ -342,9 +342,9 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
342
342
|
var _ref9 = options || {},
|
|
343
343
|
dragAndDropEnabled = _ref9.dragAndDropEnabled;
|
|
344
344
|
return tableEditing({
|
|
345
|
-
reportFixedTable: function reportFixedTable(
|
|
346
|
-
var tr =
|
|
347
|
-
reason =
|
|
345
|
+
reportFixedTable: function reportFixedTable(_ref0) {
|
|
346
|
+
var tr = _ref0.tr,
|
|
347
|
+
reason = _ref0.reason;
|
|
348
348
|
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
|
|
349
349
|
action: TABLE_ACTION.FIXED,
|
|
350
350
|
actionSubject: ACTION_SUBJECT.TABLE,
|
|
@@ -360,61 +360,61 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
360
360
|
}
|
|
361
361
|
}, {
|
|
362
362
|
name: 'tableStickyHeaders',
|
|
363
|
-
plugin: function plugin(
|
|
364
|
-
var dispatch =
|
|
365
|
-
eventDispatcher =
|
|
363
|
+
plugin: function plugin(_ref1) {
|
|
364
|
+
var dispatch = _ref1.dispatch,
|
|
365
|
+
eventDispatcher = _ref1.eventDispatcher;
|
|
366
366
|
return options && options.tableOptions.stickyHeaders ? createStickyHeadersPlugin(dispatch, function () {
|
|
367
367
|
return [];
|
|
368
368
|
}) : undefined;
|
|
369
369
|
}
|
|
370
370
|
}, {
|
|
371
371
|
name: 'tableDragAndDrop',
|
|
372
|
-
plugin: function plugin(
|
|
373
|
-
var dispatch =
|
|
372
|
+
plugin: function plugin(_ref10) {
|
|
373
|
+
var dispatch = _ref10.dispatch;
|
|
374
374
|
return options !== null && options !== void 0 && options.dragAndDropEnabled ? createDragAndDropPlugin(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor) : undefined;
|
|
375
375
|
}
|
|
376
376
|
}, {
|
|
377
377
|
name: 'tableViewModeSort',
|
|
378
|
-
plugin: function plugin(
|
|
379
|
-
var nodeViewPortalProviderAPI =
|
|
378
|
+
plugin: function plugin(_ref11) {
|
|
379
|
+
var nodeViewPortalProviderAPI = _ref11.nodeViewPortalProviderAPI;
|
|
380
380
|
return api !== null && api !== void 0 && api.editorViewMode ? createViewModeSortPlugin(api, nodeViewPortalProviderAPI) : undefined;
|
|
381
381
|
}
|
|
382
382
|
}, {
|
|
383
383
|
name: 'tableLocalId',
|
|
384
|
-
plugin: function plugin(
|
|
385
|
-
var dispatch =
|
|
384
|
+
plugin: function plugin(_ref12) {
|
|
385
|
+
var dispatch = _ref12.dispatch;
|
|
386
386
|
return createTableLocalIdPlugin(dispatch);
|
|
387
387
|
}
|
|
388
388
|
}, {
|
|
389
389
|
name: 'tableWidth',
|
|
390
|
-
plugin: function plugin(
|
|
390
|
+
plugin: function plugin(_ref13) {
|
|
391
391
|
var _options$fullWidthEna, _options$isTableScali, _options$tableOptions3, _options$isCommentEdi;
|
|
392
|
-
var dispatchAnalyticsEvent =
|
|
393
|
-
dispatch =
|
|
392
|
+
var dispatchAnalyticsEvent = _ref13.dispatchAnalyticsEvent,
|
|
393
|
+
dispatch = _ref13.dispatch;
|
|
394
394
|
return options !== null && options !== void 0 && options.tableOptions.allowTableResizing ? createTableWidthPlugin(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$isTableScali = options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$tableOptions3 = options.tableOptions.allowTableResizing) !== null && _options$tableOptions3 !== void 0 ? _options$tableOptions3 : false, (_options$isCommentEdi = options.isCommentEditor) !== null && _options$isCommentEdi !== void 0 ? _options$isCommentEdi : false) : undefined;
|
|
395
395
|
}
|
|
396
396
|
}, {
|
|
397
397
|
name: 'tableWidthInCommentFix',
|
|
398
|
-
plugin: function plugin(
|
|
398
|
+
plugin: function plugin(_ref14) {
|
|
399
399
|
var _options$tableOptions4;
|
|
400
|
-
var dispatch =
|
|
400
|
+
var dispatch = _ref14.dispatch;
|
|
401
401
|
return options !== null && options !== void 0 && options.tableOptions.allowTableResizing && options !== null && options !== void 0 && options.isCommentEditor ? createTableWidthInCommentFixPlugin(dispatch, (_options$tableOptions4 = options.tableOptions.allowTableAlignment) !== null && _options$tableOptions4 !== void 0 ? _options$tableOptions4 : false) : undefined;
|
|
402
402
|
}
|
|
403
403
|
},
|
|
404
404
|
// TODO: ED-26961 - should be deprecated and eventually replaced with 'tableAnalyticsPlugin'
|
|
405
405
|
{
|
|
406
406
|
name: 'tableOverflowAnalyticsPlugin',
|
|
407
|
-
plugin: function plugin(
|
|
407
|
+
plugin: function plugin(_ref15) {
|
|
408
408
|
var _options$tableOptions5;
|
|
409
|
-
var dispatch =
|
|
410
|
-
dispatchAnalyticsEvent =
|
|
409
|
+
var dispatch = _ref15.dispatch,
|
|
410
|
+
dispatchAnalyticsEvent = _ref15.dispatchAnalyticsEvent;
|
|
411
411
|
return createTableOverflowAnalyticsPlugin(dispatch, dispatchAnalyticsEvent, (_options$tableOptions5 = options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing) !== null && _options$tableOptions5 !== void 0 ? _options$tableOptions5 : false);
|
|
412
412
|
}
|
|
413
413
|
}, {
|
|
414
414
|
name: 'tableAnalyticsPlugin',
|
|
415
|
-
plugin: function plugin(
|
|
416
|
-
var dispatch =
|
|
417
|
-
dispatchAnalyticsEvent =
|
|
415
|
+
plugin: function plugin(_ref16) {
|
|
416
|
+
var dispatch = _ref16.dispatch,
|
|
417
|
+
dispatchAnalyticsEvent = _ref16.dispatchAnalyticsEvent;
|
|
418
418
|
return createTableAnalyticsPlugin(dispatch, dispatchAnalyticsEvent);
|
|
419
419
|
}
|
|
420
420
|
}, {
|
|
@@ -433,8 +433,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
433
433
|
}
|
|
434
434
|
}, {
|
|
435
435
|
name: 'tableSizeSelectorPlugin',
|
|
436
|
-
plugin: function plugin(
|
|
437
|
-
var dispatch =
|
|
436
|
+
plugin: function plugin(_ref17) {
|
|
437
|
+
var dispatch = _ref17.dispatch;
|
|
438
438
|
return isTableSelectorEnabled ? createSizeSelectorPlugin(dispatch) : undefined;
|
|
439
439
|
}
|
|
440
440
|
}];
|
|
@@ -451,13 +451,13 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
451
451
|
}
|
|
452
452
|
return plugins;
|
|
453
453
|
},
|
|
454
|
-
contentComponent: function contentComponent(
|
|
454
|
+
contentComponent: function contentComponent(_ref18) {
|
|
455
455
|
var _api$featureFlags;
|
|
456
|
-
var editorView =
|
|
457
|
-
popupsMountPoint =
|
|
458
|
-
popupsBoundariesElement =
|
|
459
|
-
popupsScrollableElement =
|
|
460
|
-
dispatchAnalyticsEvent =
|
|
456
|
+
var editorView = _ref18.editorView,
|
|
457
|
+
popupsMountPoint = _ref18.popupsMountPoint,
|
|
458
|
+
popupsBoundariesElement = _ref18.popupsBoundariesElement,
|
|
459
|
+
popupsScrollableElement = _ref18.popupsScrollableElement,
|
|
460
|
+
dispatchAnalyticsEvent = _ref18.dispatchAnalyticsEvent;
|
|
461
461
|
if (editorExperiment('platform_editor_usesharedpluginstateselector', true)) {
|
|
462
462
|
return /*#__PURE__*/React.createElement(ContentComponent, {
|
|
463
463
|
api: api,
|
|
@@ -490,14 +490,14 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
490
490
|
dragAndDropState: dragAndDropPluginKey,
|
|
491
491
|
sizeSelectorPluginState: sizeSelectorPluginKey
|
|
492
492
|
},
|
|
493
|
-
render: function render(
|
|
493
|
+
render: function render(_ref19) {
|
|
494
494
|
var _sizeSelectorPluginSt, _api$analytics3;
|
|
495
|
-
var resizingPluginState =
|
|
496
|
-
stickyHeadersState =
|
|
497
|
-
tablePluginState =
|
|
498
|
-
tableWidthPluginState =
|
|
499
|
-
dragAndDropState =
|
|
500
|
-
sizeSelectorPluginState =
|
|
495
|
+
var resizingPluginState = _ref19.tableResizingPluginState,
|
|
496
|
+
stickyHeadersState = _ref19.stickyHeadersState,
|
|
497
|
+
tablePluginState = _ref19.tablePluginState,
|
|
498
|
+
tableWidthPluginState = _ref19.tableWidthPluginState,
|
|
499
|
+
dragAndDropState = _ref19.dragAndDropState,
|
|
500
|
+
sizeSelectorPluginState = _ref19.sizeSelectorPluginState;
|
|
501
501
|
// Any changes made inside `<WithPluginState>` need to be reflected in the
|
|
502
502
|
// `<ContentComponent>` as well.
|
|
503
503
|
var isColumnResizing = resizingPluginState === null || resizingPluginState === void 0 ? void 0 : resizingPluginState.dragging;
|
|
@@ -507,20 +507,20 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
507
507
|
var isResizing = isColumnResizing || isTableResizing;
|
|
508
508
|
var widthToWidest = tablePluginState === null || tablePluginState === void 0 ? void 0 : tablePluginState.widthToWidest;
|
|
509
509
|
var isSizeSelectorOpen = sizeSelectorPluginState === null || sizeSelectorPluginState === void 0 ? void 0 : sizeSelectorPluginState.isSelectorOpen;
|
|
510
|
-
var
|
|
511
|
-
tableNode =
|
|
512
|
-
tablePos =
|
|
513
|
-
targetCellPosition =
|
|
514
|
-
isContextualMenuOpen =
|
|
515
|
-
tableRef =
|
|
516
|
-
pluginConfig =
|
|
517
|
-
insertColumnButtonIndex =
|
|
518
|
-
insertRowButtonIndex =
|
|
519
|
-
isHeaderColumnEnabled =
|
|
520
|
-
isHeaderRowEnabled =
|
|
521
|
-
isDragAndDropEnabled =
|
|
522
|
-
tableWrapperTarget =
|
|
523
|
-
isCellMenuOpenByKeyboard =
|
|
510
|
+
var _ref20 = tablePluginState,
|
|
511
|
+
tableNode = _ref20.tableNode,
|
|
512
|
+
tablePos = _ref20.tablePos,
|
|
513
|
+
targetCellPosition = _ref20.targetCellPosition,
|
|
514
|
+
isContextualMenuOpen = _ref20.isContextualMenuOpen,
|
|
515
|
+
tableRef = _ref20.tableRef,
|
|
516
|
+
pluginConfig = _ref20.pluginConfig,
|
|
517
|
+
insertColumnButtonIndex = _ref20.insertColumnButtonIndex,
|
|
518
|
+
insertRowButtonIndex = _ref20.insertRowButtonIndex,
|
|
519
|
+
isHeaderColumnEnabled = _ref20.isHeaderColumnEnabled,
|
|
520
|
+
isHeaderRowEnabled = _ref20.isHeaderRowEnabled,
|
|
521
|
+
isDragAndDropEnabled = _ref20.isDragAndDropEnabled,
|
|
522
|
+
tableWrapperTarget = _ref20.tableWrapperTarget,
|
|
523
|
+
isCellMenuOpenByKeyboard = _ref20.isCellMenuOpenByKeyboard;
|
|
524
524
|
var allowControls = pluginConfig.allowControls;
|
|
525
525
|
var stickyHeader = stickyHeadersState ? findStickyHeaderForTable(stickyHeadersState, tablePos) : undefined;
|
|
526
526
|
return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
|
|
@@ -622,8 +622,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
622
622
|
}));
|
|
623
623
|
},
|
|
624
624
|
pluginsOptions: {
|
|
625
|
-
quickInsert: function quickInsert(
|
|
626
|
-
var formatMessage =
|
|
625
|
+
quickInsert: function quickInsert(_ref21) {
|
|
626
|
+
var formatMessage = _ref21.formatMessage;
|
|
627
627
|
return [{
|
|
628
628
|
id: 'table',
|
|
629
629
|
title: formatMessage(messages.table),
|
|
@@ -694,8 +694,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
694
694
|
return editorViewRef.current;
|
|
695
695
|
}, options, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)(pluginConfig(options === null || options === void 0 ? void 0 : options.tableOptions))
|
|
696
696
|
},
|
|
697
|
-
usePluginHook: function usePluginHook(
|
|
698
|
-
var editorView =
|
|
697
|
+
usePluginHook: function usePluginHook(_ref22) {
|
|
698
|
+
var editorView = _ref22.editorView;
|
|
699
699
|
var _useTableSharedState = useTableSharedState(api),
|
|
700
700
|
mode = _useTableSharedState.mode;
|
|
701
701
|
useEffect(function () {
|
|
@@ -419,8 +419,8 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
419
419
|
formatMessage = _this$props9.intl.formatMessage,
|
|
420
420
|
editorView = _this$props9.editorView,
|
|
421
421
|
allowColumnSorting = _this$props9.allowColumnSorting;
|
|
422
|
-
var
|
|
423
|
-
isDragAndDropEnabled =
|
|
422
|
+
var _getPluginState0 = getPluginState(editorView.state),
|
|
423
|
+
isDragAndDropEnabled = _getPluginState0.isDragAndDropEnabled;
|
|
424
424
|
if (allowColumnSorting && !isDragAndDropEnabled) {
|
|
425
425
|
var hasMergedCellsInTable = getMergedCellsPositions(editorView.state.tr).length > 0;
|
|
426
426
|
var warning = hasMergedCellsInTable ? {
|
|
@@ -489,21 +489,21 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
489
489
|
});
|
|
490
490
|
_defineProperty(_this, "onMenuItemActivated", function (_ref2) {
|
|
491
491
|
var item = _ref2.item;
|
|
492
|
-
var _this$
|
|
493
|
-
editorView = _this$
|
|
494
|
-
selectionRect = _this$
|
|
495
|
-
editorAnalyticsAPI = _this$
|
|
496
|
-
getEditorContainerWidth = _this$
|
|
497
|
-
getEditorFeatureFlags = _this$
|
|
498
|
-
isCellMenuOpenByKeyboard = _this$
|
|
499
|
-
isCommentEditor = _this$
|
|
492
|
+
var _this$props0 = _this.props,
|
|
493
|
+
editorView = _this$props0.editorView,
|
|
494
|
+
selectionRect = _this$props0.selectionRect,
|
|
495
|
+
editorAnalyticsAPI = _this$props0.editorAnalyticsAPI,
|
|
496
|
+
getEditorContainerWidth = _this$props0.getEditorContainerWidth,
|
|
497
|
+
getEditorFeatureFlags = _this$props0.getEditorFeatureFlags,
|
|
498
|
+
isCellMenuOpenByKeyboard = _this$props0.isCellMenuOpenByKeyboard,
|
|
499
|
+
isCommentEditor = _this$props0.isCommentEditor;
|
|
500
500
|
// TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
|
|
501
501
|
var state = editorView.state,
|
|
502
502
|
dispatch = editorView.dispatch;
|
|
503
|
-
var
|
|
504
|
-
targetCellPosition =
|
|
505
|
-
|
|
506
|
-
isTableScalingEnabled =
|
|
503
|
+
var _getPluginState1 = getPluginState(state),
|
|
504
|
+
targetCellPosition = _getPluginState1.targetCellPosition,
|
|
505
|
+
_getPluginState1$isTa = _getPluginState1.isTableScalingEnabled,
|
|
506
|
+
isTableScalingEnabled = _getPluginState1$isTa === void 0 ? false : _getPluginState1$isTa;
|
|
507
507
|
var _ref3 = getEditorFeatureFlags ? getEditorFeatureFlags() : {},
|
|
508
508
|
_ref3$tableWithFixedC = _ref3.tableWithFixedColumnWidthsOption,
|
|
509
509
|
tableWithFixedColumnWidthsOption = _ref3$tableWithFixedC === void 0 ? false : _ref3$tableWithFixedC;
|
|
@@ -567,8 +567,8 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
567
567
|
_this.toggleOpen();
|
|
568
568
|
break;
|
|
569
569
|
case 'delete_row':
|
|
570
|
-
var
|
|
571
|
-
isHeaderRowRequired =
|
|
570
|
+
var _getPluginState10 = getPluginState(state),
|
|
571
|
+
isHeaderRowRequired = _getPluginState10.pluginConfig.isHeaderRowRequired;
|
|
572
572
|
deleteRowsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.CONTEXT_MENU, selectionRect, !!isHeaderRowRequired)(state, dispatch);
|
|
573
573
|
_this.toggleOpen();
|
|
574
574
|
break;
|
|
@@ -588,11 +588,11 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
588
588
|
}
|
|
589
589
|
});
|
|
590
590
|
_defineProperty(_this, "toggleOpen", function () {
|
|
591
|
-
var _this$
|
|
592
|
-
isOpen = _this$
|
|
593
|
-
_this$
|
|
594
|
-
state = _this$
|
|
595
|
-
dispatch = _this$
|
|
591
|
+
var _this$props1 = _this.props,
|
|
592
|
+
isOpen = _this$props1.isOpen,
|
|
593
|
+
_this$props1$editorVi = _this$props1.editorView,
|
|
594
|
+
state = _this$props1$editorVi.state,
|
|
595
|
+
dispatch = _this$props1$editorVi.dispatch;
|
|
596
596
|
toggleContextualMenu()(state, dispatch);
|
|
597
597
|
if (!isOpen) {
|
|
598
598
|
_this.setState({
|
|
@@ -601,12 +601,12 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
601
601
|
}
|
|
602
602
|
});
|
|
603
603
|
_defineProperty(_this, "handleOpenChange", function (payload) {
|
|
604
|
-
var _this$
|
|
605
|
-
_this$
|
|
606
|
-
state = _this$
|
|
607
|
-
dispatch = _this$
|
|
608
|
-
dom = _this$
|
|
609
|
-
isCellMenuOpenByKeyboard = _this$
|
|
604
|
+
var _this$props10 = _this.props,
|
|
605
|
+
_this$props10$editorV = _this$props10.editorView,
|
|
606
|
+
state = _this$props10$editorV.state,
|
|
607
|
+
dispatch = _this$props10$editorV.dispatch,
|
|
608
|
+
dom = _this$props10$editorV.dom,
|
|
609
|
+
isCellMenuOpenByKeyboard = _this$props10.isCellMenuOpenByKeyboard;
|
|
610
610
|
if (payload) {
|
|
611
611
|
var event = payload.event;
|
|
612
612
|
if (event && event instanceof KeyboardEvent) {
|
|
@@ -639,11 +639,11 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
639
639
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
640
640
|
_defineProperty(_this, "handleItemMouseEnter", function (_ref4) {
|
|
641
641
|
var item = _ref4.item;
|
|
642
|
-
var _this$
|
|
643
|
-
_this$
|
|
644
|
-
state = _this$
|
|
645
|
-
dispatch = _this$
|
|
646
|
-
selectionRect = _this$
|
|
642
|
+
var _this$props11 = _this.props,
|
|
643
|
+
_this$props11$editorV = _this$props11.editorView,
|
|
644
|
+
state = _this$props11$editorV.state,
|
|
645
|
+
dispatch = _this$props11$editorV.dispatch,
|
|
646
|
+
selectionRect = _this$props11.selectionRect;
|
|
647
647
|
if (item.value.name === 'background') {
|
|
648
648
|
if (!_this.state.isSubmenuOpen) {
|
|
649
649
|
_this.setState({
|
|
@@ -683,9 +683,9 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
683
683
|
}
|
|
684
684
|
});
|
|
685
685
|
_defineProperty(_this, "setColor", function (color) {
|
|
686
|
-
var _this$
|
|
687
|
-
editorView = _this$
|
|
688
|
-
editorAnalyticsAPI = _this$
|
|
686
|
+
var _this$props12 = _this.props,
|
|
687
|
+
editorView = _this$props12.editorView,
|
|
688
|
+
editorAnalyticsAPI = _this$props12.editorAnalyticsAPI;
|
|
689
689
|
var state = editorView.state,
|
|
690
690
|
dispatch = editorView.dispatch;
|
|
691
691
|
setColorWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.CONTEXT_MENU, color)(state, dispatch);
|
|
@@ -711,15 +711,15 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
711
711
|
}, {
|
|
712
712
|
key: "render",
|
|
713
713
|
value: function render() {
|
|
714
|
-
var _this$
|
|
715
|
-
isOpen = _this$
|
|
716
|
-
mountPoint = _this$
|
|
717
|
-
offset = _this$
|
|
718
|
-
boundariesElement = _this$
|
|
719
|
-
editorView = _this$
|
|
720
|
-
isCellMenuOpenByKeyboard = _this$
|
|
721
|
-
var
|
|
722
|
-
isDragAndDropEnabled =
|
|
714
|
+
var _this$props13 = this.props,
|
|
715
|
+
isOpen = _this$props13.isOpen,
|
|
716
|
+
mountPoint = _this$props13.mountPoint,
|
|
717
|
+
offset = _this$props13.offset,
|
|
718
|
+
boundariesElement = _this$props13.boundariesElement,
|
|
719
|
+
editorView = _this$props13.editorView,
|
|
720
|
+
isCellMenuOpenByKeyboard = _this$props13.isCellMenuOpenByKeyboard;
|
|
721
|
+
var _getPluginState11 = getPluginState(editorView.state),
|
|
722
|
+
isDragAndDropEnabled = _getPluginState11.isDragAndDropEnabled;
|
|
723
723
|
var items = isDragAndDropEnabled ? this.createNewContextMenuItems() : this.createOriginalContextMenuItems();
|
|
724
724
|
var isOpenAllowed = false;
|
|
725
725
|
isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
|
|
@@ -288,9 +288,9 @@ var handleMouseMoveDebounce = function handleMouseMoveDebounce(nodeViewPortalPro
|
|
|
288
288
|
var _getPluginState6 = getPluginState(state),
|
|
289
289
|
insertColumnButtonIndex = _getPluginState6.insertColumnButtonIndex;
|
|
290
290
|
var _getColumnOrRowIndex9 = getColumnOrRowIndex(element),
|
|
291
|
-
|
|
292
|
-
startIndex =
|
|
293
|
-
endIndex =
|
|
291
|
+
_getColumnOrRowIndex0 = _slicedToArray(_getColumnOrRowIndex9, 2),
|
|
292
|
+
startIndex = _getColumnOrRowIndex0[0],
|
|
293
|
+
endIndex = _getColumnOrRowIndex0[1];
|
|
294
294
|
var positionColumn = getMousePositionHorizontalRelativeByElement(event, offsetX, undefined) === 'right' ? endIndex : startIndex;
|
|
295
295
|
if (positionColumn !== insertColumnButtonIndex) {
|
|
296
296
|
return showInsertColumnButton(positionColumn)(state, dispatch);
|
|
@@ -301,10 +301,10 @@ var handleMouseMoveDebounce = function handleMouseMoveDebounce(nodeViewPortalPro
|
|
|
301
301
|
_dispatch4 = view.dispatch;
|
|
302
302
|
var _getPluginState7 = getPluginState(_state3),
|
|
303
303
|
insertRowButtonIndex = _getPluginState7.insertRowButtonIndex;
|
|
304
|
-
var
|
|
305
|
-
|
|
306
|
-
_startIndex3 =
|
|
307
|
-
_endIndex2 =
|
|
304
|
+
var _getColumnOrRowIndex1 = getColumnOrRowIndex(element),
|
|
305
|
+
_getColumnOrRowIndex10 = _slicedToArray(_getColumnOrRowIndex1, 2),
|
|
306
|
+
_startIndex3 = _getColumnOrRowIndex10[0],
|
|
307
|
+
_endIndex2 = _getColumnOrRowIndex10[1];
|
|
308
308
|
var positionRow = getMousePositionVerticalRelativeByElement(event) === 'bottom' ? _endIndex2 : _startIndex3;
|
|
309
309
|
if (positionRow !== insertRowButtonIndex) {
|
|
310
310
|
return showInsertRowButton(positionRow)(_state3, _dispatch4);
|
|
@@ -426,8 +426,8 @@ export var handleCut = function handleCut(oldTr, oldState, newState, api, editor
|
|
|
426
426
|
return tr;
|
|
427
427
|
};
|
|
428
428
|
export var isTableInFocus = function isTableInFocus(view) {
|
|
429
|
-
var
|
|
430
|
-
return !!((
|
|
429
|
+
var _getPluginState0, _getResizePluginState;
|
|
430
|
+
return !!((_getPluginState0 = getPluginState(view.state)) !== null && _getPluginState0 !== void 0 && _getPluginState0.tableNode) && !((_getResizePluginState = getResizePluginState(view.state)) !== null && _getResizePluginState !== void 0 && _getResizePluginState.dragging);
|
|
431
431
|
};
|
|
432
432
|
export var whenTableInFocus = function whenTableInFocus(eventHandler, pluginInjectionApi) {
|
|
433
433
|
return function (view, mouseEvent) {
|
|
@@ -454,9 +454,9 @@ var trackCellLocation = function trackCellLocation(view, mouseEvent) {
|
|
|
454
454
|
// Ignored via go/ees005
|
|
455
455
|
// eslint-disable-next-line @atlaskit/editor/no-as-casting
|
|
456
456
|
var maybeTableCell = isElementInTableCell(target);
|
|
457
|
-
var
|
|
458
|
-
tableNode =
|
|
459
|
-
tableRef =
|
|
457
|
+
var _getPluginState1 = getPluginState(view.state),
|
|
458
|
+
tableNode = _getPluginState1.tableNode,
|
|
459
|
+
tableRef = _getPluginState1.tableRef;
|
|
460
460
|
|
|
461
461
|
// Ignored via go/ees005
|
|
462
462
|
// eslint-disable-next-line @atlaskit/editor/no-as-casting
|
package/dist/esm/ui/ui-styles.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
|
2
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22
|
|
2
|
+
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;
|
|
3
3
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs mahual remediation */
|
|
4
4
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
5
5
|
import { css } from '@emotion/react';
|
|
@@ -55,7 +55,7 @@ export var dragInsertButtonWrapper = function dragInsertButtonWrapper() {
|
|
|
55
55
|
// Explicit pixel values required here to ensure corner button aligns correctly
|
|
56
56
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
57
57
|
export var dragCornerControlButton = function dragCornerControlButton() {
|
|
58
|
-
return css(
|
|
58
|
+
return css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\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"])), ClassName.DRAG_CORNER_BUTTON, akEditorUnitZIndex * 99, ClassName.DRAG_CORNER_BUTTON_INNER, "var(--ds-border-selected, #0C66E4)", ClassName.DRAG_CORNER_BUTTON_INNER, ClassName.DRAG_CORNER_BUTTON_INNER, "var(--ds-border-inverse, #FFF)", "var(--ds-background-accent-gray-subtler, #DCDFE4)");
|
|
59
59
|
};
|
|
60
60
|
export var insertColumnButtonWrapper = function insertColumnButtonWrapper() {
|
|
61
61
|
return css(
|
|
@@ -76,17 +76,17 @@ export var insertRowButtonWrapper = function insertRowButtonWrapper() {
|
|
|
76
76
|
InsertLine("\n height: 2px;\n top: -11px;\n\t".concat("\n left: ", tableInsertColumnButtonSize - 1, "px;\n ")));
|
|
77
77
|
};
|
|
78
78
|
export var columnControlsLineMarker = function columnControlsLineMarker() {
|
|
79
|
-
return css(
|
|
79
|
+
return css(_templateObject1 || (_templateObject1 = _taggedTemplateLiteral(["\n\t.", ".", " table tr:first-of-type td,\n\t.", ".", " table tr:first-of-type th {\n\t\tposition: relative;\n\t}\n"])), ClassName.TABLE_CONTAINER, ClassName.WITH_CONTROLS, ClassName.TABLE_CONTAINER, ClassName.WITH_CONTROLS);
|
|
80
80
|
};
|
|
81
81
|
export var DeleteButton = function DeleteButton() {
|
|
82
|
-
return css(
|
|
82
|
+
return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\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"])), ClassName.CONTROLS_DELETE_BUTTON_WRAP, ClassName.CONTROLS_DELETE_BUTTON, tableDeleteButtonSize, tableDeleteButtonSize, ClassName.CONTROLS_DELETE_BUTTON_WRAP, ClassName.CONTROLS_DELETE_BUTTON, Button("\n background: ".concat(tableCellSelectedDeleteIconBackground, ";\n color: ").concat(tableCellSelectedDeleteIconColor, ";\n ")), ClassName.CONTROLS_DELETE_BUTTON, tableCellHoverDeleteIconBackground, tableCellHoverDeleteIconColor);
|
|
83
83
|
};
|
|
84
84
|
export var OverflowShadow = function OverflowShadow(isDragAndDropEnabled) {
|
|
85
|
-
return css(
|
|
85
|
+
return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\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"])), ClassName.TABLE_RIGHT_SHADOW, ClassName.TABLE_LEFT_SHADOW, tableMarginTop, tableMarginTop, akEditorShadowZIndex, tableOverflowShadowWidthWide, ClassName.TABLE_LEFT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(N40A, ")"), "var(--ds-shadow-overflow-perimeter, transparent)", ClassName.TABLE_CONTAINER, ClassName.TABLE_STICKY_SHADOW, ClassName.TABLE_LEFT_SHADOW, akEditorTableNumberColumnWidth - 1, ClassName.TABLE_RIGHT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(N40A, ")"), "var(--ds-shadow-overflow-perimeter, transparent)", tableOverflowShadowWidthWide, ClassName.WITH_CONTROLS, overflowShadowWidhoutDnD(isDragAndDropEnabled), ClassName.TABLE_LEFT_SHADOW, tableBorderColor);
|
|
86
86
|
};
|
|
87
87
|
var overflowShadowWidhoutDnD = function overflowShadowWidhoutDnD(isDragAndDropEnabled) {
|
|
88
88
|
if (!isDragAndDropEnabled) {
|
|
89
|
-
return css(
|
|
89
|
+
return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\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"])), ClassName.TABLE_RIGHT_SHADOW, ClassName.TABLE_LEFT_SHADOW, tableMarginTopWithControl, tableMarginTopWithControl);
|
|
90
90
|
}
|
|
91
91
|
};
|
|
92
92
|
var columnHeaderButton = function columnHeaderButton(cssString) {
|
|
@@ -116,34 +116,34 @@ var columnHeaderButtonSelected = function columnHeaderButtonSelected() {
|
|
|
116
116
|
});
|
|
117
117
|
};
|
|
118
118
|
var getFloatingDotOverrides = function getFloatingDotOverrides() {
|
|
119
|
-
return css(
|
|
119
|
+
return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\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"])), ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.COLUMN_CONTROLS_DECORATIONS, tableBorderColor, lineMarkerSize, lineMarkerSize, "var(--ds-space-025, 2px)");
|
|
120
120
|
};
|
|
121
121
|
export var floatingColumnControls = function floatingColumnControls() {
|
|
122
|
-
return css(
|
|
122
|
+
return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\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"])), ClassName.DRAG_COLUMN_DROP_TARGET_CONTROLS, ClassName.DRAG_COLUMN_CONTROLS_INNER, ClassName.DRAG_COLUMN_CONTROLS, ClassName.DRAG_COLUMN_CONTROLS_INNER);
|
|
123
123
|
};
|
|
124
124
|
export var rowControlsWrapperDotStyle = function rowControlsWrapperDotStyle() {
|
|
125
|
-
return css(
|
|
125
|
+
return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\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"])), ClassName.WITH_CONTROLS, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.WITH_CONTROLS, ClassName.ROW_CONTROLS_WRAPPER, tableBorderColor, lineMarkerSize, lineMarkerSize, tableToolbarSize + tableCellBorderWidth);
|
|
126
126
|
};
|
|
127
127
|
export var columnControlsDecoration = function columnControlsDecoration() {
|
|
128
|
-
return css(
|
|
128
|
+
return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\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"])), ClassName.COLUMN_CONTROLS_DECORATIONS, columnControlsDecorationHeight + tableCellBorderWidth, columnControlsDecorationHeight, tableBorderColor, lineMarkerSize, lineMarkerSize, "var(--ds-space-negative-025, -2px)", columnHeaderButton("\n border-right: ".concat(tableCellBorderWidth, "px solid ").concat(tableBorderColor, ";\n border-top: ").concat(tableCellBorderWidth, "px solid ").concat(tableBorderColor, ";\n border-bottom: ").concat(tableCellBorderWidth, "px solid ").concat(tableBorderColor, ";\n box-sizing: content-box;\n height: ").concat(tableToolbarSize - 1, "px;\n width: 100%;\n position: absolute;\n top: ").concat(columnControlsDecorationHeight - tableToolbarSize, "px;\n left: 0px;\n z-index: ").concat(columnControlsZIndex, ";\n ")), getFloatingDotOverrides(), ClassName.WITH_CONTROLS, ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_TABLE, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), ClassName.HOVERED_CELL_IN_DANGER, ClassName.COLUMN_CONTROLS_DECORATIONS, tableToolbarDeleteColor, tableBorderDeleteColor, akEditorUnitZIndex * 100, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_COLUMN, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), tableCellBorderWidth, tableBorderSelectedColor, tableCellBorderWidth, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_COLUMN, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), ClassName.HOVERED_CELL_IN_DANGER, ClassName.COLUMN_CONTROLS_DECORATIONS, tableToolbarDeleteColor, tableBorderDeleteColor, tableCellBorderWidth, tableBorderDeleteColor, tableCellBorderWidth, akEditorUnitZIndex * 100, ClassName.TABLE_SELECTED, ClassName.TABLE_CELL, ClassName.TABLE_SELECTED, ClassName.TABLE_HEADER_CELL, ClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected());
|
|
129
129
|
};
|
|
130
130
|
export var hoveredDeleteButton = function hoveredDeleteButton() {
|
|
131
|
-
return css(
|
|
131
|
+
return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\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"])), ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.SELECTED_CELL, ClassName.COLUMN_SELECTED, ClassName.HOVERED_CELL, tableBorderDeleteColor, ClassName.SELECTED_CELL, tableCellDeleteColor, ClassName.TABLE_NODE_WRAPPER, ClassName.HOVERED_NO_HIGHLIGHT, tableCellDeleteColor, tableBorderDeleteColor, ClassName.HOVERED_NO_HIGHLIGHT, ClassName.HOVERED_NO_HIGHLIGHT, tableCellDeleteColor, tableBorderDeleteColor);
|
|
132
132
|
};
|
|
133
133
|
export var hoveredCell = function hoveredCell() {
|
|
134
|
-
return css(
|
|
134
|
+
return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\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"])), ClassName.IS_RESIZING, ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.HOVERED_CELL, tableBorderSelectedColor, ClassName.HOVERED_CELL, ClassName.HOVERED_NO_HIGHLIGHT, tableBorderColor);
|
|
135
135
|
};
|
|
136
136
|
|
|
137
137
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
138
|
-
export var hoveredWarningCell = css(
|
|
138
|
+
export var hoveredWarningCell = css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\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"])), ClassName.IS_RESIZING, ClassName.TABLE_CONTAINER, ClassName.HOVERED_DELETE_BUTTON, ClassName.HOVERED_CELL_WARNING, "var(--ds-background-warning, ".concat(Y50, ")"), "var(--ds-border-warning, ".concat(Y200, ")"));
|
|
139
139
|
|
|
140
140
|
// Explicit pixel values required here to ensure correct positioning and sizes of column resize handle
|
|
141
141
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
142
142
|
var resizeLineStyles = function resizeLineStyles() {
|
|
143
|
-
return css(
|
|
143
|
+
return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\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"])), ClassName.WITH_DRAG_RESIZE_LINE, ClassName.WITH_DRAG_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableBorderSelectedColor, columnControlsZIndex * 2, ClassName.WITH_DRAG_RESIZE_LINE_LAST_COLUMN, ClassName.WITH_DRAG_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableBorderSelectedColor, columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableBorderSelectedColor, columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", resizeLineWidth, tableToolbarSize + tableCellBorderWidth, tableBorderSelectedColor, columnControlsZIndex * 2, tableToolbarSize + tableCellBorderWidth, ClassName.WITH_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableBorderSelectedColor, columnControlsZIndex * 2, ClassName.WITH_RESIZE_LINE_LAST_COLUMN, resizeLineWidth, tableToolbarSize + tableCellBorderWidth, tableBorderSelectedColor, columnControlsZIndex * 2, tableToolbarSize + tableCellBorderWidth);
|
|
144
144
|
};
|
|
145
145
|
export var resizeHandle = function resizeHandle() {
|
|
146
|
-
return css(
|
|
146
|
+
return css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\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"])), ClassName.TABLE_CONTAINER, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth, resizeHandlerAreaWidth / 2, resizeHandlerZIndex, ClassName.RESIZE_HANDLE_DECORATION, ClassName.RESIZE_HANDLE_DECORATION, resizeHandlerAreaWidth / 2, resizeHandlerZIndex, resizeLineStyles(), ClassName.WITH_DRAG_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, ClassName.WITH_DRAG_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, tableToolbarSize + tableCellBorderWidth, tableToolbarSize + tableCellBorderWidth);
|
|
147
147
|
};
|
|
148
148
|
|
|
149
149
|
// Drag and Drop: drop target insert line
|
|
@@ -181,5 +181,5 @@ var insertLineInactiveColor = css({
|
|
|
181
181
|
// or column drag
|
|
182
182
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
183
183
|
export var insertLine = function insertLine() {
|
|
184
|
-
return css(
|
|
184
|
+
return css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\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"])), ClassName.TABLE_CONTAINER, ClassName.WITH_FIRST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, insertLineActiveColor, ClassName.WITH_FIRST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, insertLineInactiveColor, ClassName.WITH_FIRST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, tableCellBorderWidth, insertLineActiveColor, ClassName.WITH_FIRST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, tableCellBorderWidth, insertLineInactiveColor, ClassName.WITH_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", insertLineActiveColor, ClassName.WITH_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", insertLineInactiveColor, ClassName.WITH_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", tableCellBorderWidth, insertLineActiveColor, ClassName.WITH_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", tableCellBorderWidth, insertLineInactiveColor, ClassName.WITH_LAST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, insertLineActiveColor, ClassName.WITH_LAST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, insertLineInactiveColor, ClassName.WITH_LAST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, tableCellBorderWidth, insertLineActiveColor, ClassName.WITH_LAST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, tableCellBorderWidth, insertLineInactiveColor, ClassName.WITH_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, ClassName.WITH_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, ClassName.WITH_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, ClassName.WITH_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, ClassName.WITH_LAST_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, ClassName.WITH_LAST_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, ClassName.WITH_LAST_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, ClassName.WITH_LAST_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor);
|
|
185
185
|
};
|
package/dist/{types-ts4.5/nodeviews/lazy-node-views.d.ts → types/nodeviews/table-node-views.d.ts}
RENAMED
|
@@ -17,12 +17,12 @@ type TableViewOptions = {
|
|
|
17
17
|
isCommentEditor?: boolean;
|
|
18
18
|
isChromelessEditor?: boolean;
|
|
19
19
|
};
|
|
20
|
-
export declare const
|
|
20
|
+
export declare const tableView: (options: TableViewOptions) => (node: PMNode, view: EditorView, getPos: () => number | undefined) => import("prosemirror-view").NodeView;
|
|
21
21
|
type TableCellViewOptions = {
|
|
22
22
|
eventDispatcher: EventDispatcher;
|
|
23
23
|
pluginInjectionApi?: PluginInjectionAPI;
|
|
24
24
|
};
|
|
25
|
-
export declare const
|
|
26
|
-
export declare const
|
|
27
|
-
export declare const
|
|
25
|
+
export declare const tableCellView: (options: TableCellViewOptions) => (node: PMNode, view: EditorView, getPos: () => number | undefined) => TableCell;
|
|
26
|
+
export declare const tableHeaderView: (options: TableCellViewOptions) => (node: PMNode, view: EditorView, getPos: () => number | undefined) => TableCell;
|
|
27
|
+
export declare const tableRowView: (options: TableCellViewOptions) => (node: PMNode, view: EditorView, getPos: () => number | undefined) => TableRow;
|
|
28
28
|
export {};
|