updated table controls
This commit is contained in:
@@ -37,33 +37,29 @@ const AddColRight = () => (
|
||||
|
||||
const DeleteRow = () => (
|
||||
<svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="3" y="6.5" width="12" height="5" rx="1" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M7.5 7.5L10.5 10.5M10.5 7.5L7.5 10.5" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" />
|
||||
<rect x="2" y="7" width="14" height="4" rx="0.5" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M4 3L14 15M14 3L4 15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
const DeleteCol = () => (
|
||||
<svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="6.5" y="3" width="5" height="12" rx="1" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M7.5 7.5L10.5 10.5M10.5 7.5L7.5 10.5" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" />
|
||||
<rect x="7" y="2" width="4" height="14" rx="0.5" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M3 4L15 14M15 4L3 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
const MergeCells = () => (
|
||||
<svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="3" y="3" width="12" height="12" rx="1.5" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M9 5V13M5 9H13" stroke="currentColor" stroke-width="1" stroke-dasharray="2 2" />
|
||||
<path d="M5.5 9L7.5 9M12.5 9L10.5 9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
|
||||
<path d="M7.5 9L6.5 8M7.5 9L6.5 10M10.5 9L11.5 8M10.5 9L11.5 10" stroke="currentColor" stroke-width="1" stroke-linecap="round" />
|
||||
<rect x="2" y="4" width="14" height="10" rx="1" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M6 9H12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
const SplitCell = () => (
|
||||
<svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="3" y="3" width="12" height="12" rx="1.5" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M9 5V13" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M7 9L5 9M11 9L13 9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
|
||||
<path d="M5 9L6 8M5 9L6 10M13 9L12 8M13 9L12 10" stroke="currentColor" stroke-width="1" stroke-linecap="round" />
|
||||
<rect x="2" y="4" width="14" height="10" rx="1" stroke="currentColor" stroke-width="1.5" />
|
||||
<path d="M9 7V11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
|
||||
</svg>
|
||||
);
|
||||
|
||||
@@ -124,13 +120,13 @@ export const TableBubbleMenu: Component<TableBubbleMenuProps> = (props) => {
|
||||
actions: [
|
||||
{ label: "Merge Cells", icon: MergeCells, command: () => props.editor.chain().focus().mergeCells().run() },
|
||||
{ label: "Split Cell", icon: SplitCell, command: () => props.editor.chain().focus().splitCell().run() },
|
||||
{ label: "Header Row", icon: Type, command: () => props.editor.chain().focus().toggleHeaderRow().run() },
|
||||
{ label: "Header Row", icon: () => <Type size={18} />, command: () => props.editor.chain().focus().toggleHeaderRow().run() },
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Table",
|
||||
actions: [
|
||||
{ label: "Delete Table", icon: Trash2, iconClass: "text-destructive", command: () => props.editor.chain().focus().deleteTable().run() },
|
||||
{ label: "Delete Table", icon: () => <Trash2 size={18} />, iconClass: "text-destructive", command: () => props.editor.chain().focus().deleteTable().run() },
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
Reference in New Issue
Block a user