mirror of
https://github.com/laurent22/joplin.git
synced 2026-10-25 02:47:28 +00:00
48 lines
1.7 KiB
TypeScript
48 lines
1.7 KiB
TypeScript
import { addColumnAfter, addRowAfter, deleteColumn, deleteRow, deleteTable, tableEditing } from 'prosemirror-tables';
|
|
import createFloatingButtonPlugin, { ToolbarType } from './utils/createFloatingButtonPlugin';
|
|
import addColumnRightIcon from '../vendor/icons/addColumnRight';
|
|
import addRowBelowIcon from '../vendor/icons/addRowBelow';
|
|
import removeRowIcon from '../vendor/icons/removeRow';
|
|
import removeColumnIcon from '../vendor/icons/removeColumn';
|
|
import focusEditor from '../commands/focusEditor';
|
|
import { Command } from 'prosemirror-state';
|
|
|
|
const tableCommand = (command: Command): Command => (state, dispatch, view) => {
|
|
return command(state, dispatch, view) && focusEditor(state, dispatch, view);
|
|
};
|
|
|
|
// By default, commands like deleteRow or deleteColumn don't delete the last
|
|
// row/column in the table. This command removes the table when there are no more
|
|
// rows/columns to delete:
|
|
const runCommandOrDeleteTable = (command: Command): Command => (state, dispatch, view) => {
|
|
return command(state, dispatch, view) || deleteTable(state, dispatch);
|
|
};
|
|
|
|
const tablePlugin = [
|
|
tableEditing({ allowTableNodeSelection: true }),
|
|
createFloatingButtonPlugin('table', [
|
|
{
|
|
icon: addRowBelowIcon,
|
|
label: (_) => _('Add row'),
|
|
command: () => tableCommand(addRowAfter),
|
|
},
|
|
{
|
|
icon: addColumnRightIcon,
|
|
label: (_) => _('Add column'),
|
|
command: () => tableCommand(addColumnAfter),
|
|
},
|
|
{
|
|
icon: removeRowIcon,
|
|
label: (_) => _('Delete row'),
|
|
command: () => tableCommand(runCommandOrDeleteTable(deleteRow)),
|
|
},
|
|
{
|
|
icon: removeColumnIcon,
|
|
label: (_) => _('Delete column'),
|
|
command: () => tableCommand(runCommandOrDeleteTable(deleteColumn)),
|
|
},
|
|
], ToolbarType.FloatAboveBelow),
|
|
];
|
|
|
|
export default tablePlugin;
|