@atlaskit/editor-plugin-table
Version:
Table plugin for the @atlaskit/editor
60 lines (59 loc) • 2.06 kB
JavaScript
/**
* @jsxRuntime classic
* @jsx jsx
*/
import { useCallback } from 'react';
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
import { jsx } from '@emotion/react';
import { TableSelectorPopup } from '@atlaskit/editor-common/ui';
import { pluginKey } from '../../pm-plugins/table-size-selector';
var DEFAULT_TABLE_SELECTOR_COLS = 3;
var DEFAULT_TABLE_SELECTOR_ROWS = 3;
export var SizeSelector = function SizeSelector(_ref) {
var api = _ref.api,
target = _ref.target,
popupsMountPoint = _ref.popupsMountPoint,
popupsBoundariesElement = _ref.popupsBoundariesElement,
popupsScrollableElement = _ref.popupsScrollableElement;
var closeSelectorPopup = useCallback(function () {
api === null || api === void 0 || api.core.actions.execute(function (_ref2) {
var tr = _ref2.tr;
tr.setMeta(pluginKey, {
isSelectorOpen: false
});
return tr;
});
}, [api]);
var onSelection = useCallback(function (rowsCount, colsCount) {
api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
var tr = _ref3.tr;
api === null || api === void 0 || api.table.commands.insertTableWithSize(rowsCount, colsCount)({
tr: tr
});
tr.setMeta(pluginKey, {
isSelectorOpen: false
});
return tr;
});
}, [api]);
var onUnmount = function onUnmount() {
api === null || api === void 0 || api.core.actions.focus();
};
return jsx(TableSelectorPopup
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
, {
defaultSize: {
row: DEFAULT_TABLE_SELECTOR_ROWS,
col: DEFAULT_TABLE_SELECTOR_COLS
},
target: target,
onUnmount: onUnmount,
onSelection: onSelection,
popupsMountPoint: popupsMountPoint,
popupsScrollableElement: popupsScrollableElement,
popupsBoundariesElement: popupsBoundariesElement,
isOpenedByKeyboard: true,
handleClickOutside: closeSelectorPopup,
handleEscapeKeydown: closeSelectorPopup
});
};