Cardoza_Construction/TasGrid
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

updated table controls

Browse Source
This commit is contained in:
Timothy Cardoza
2026-03-13 14:49:01 -05:00
parent 3bfb4cd40a
commit cb8c81c299
1 changed files with 10 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/TableBubbleMenu.tsx
+10 -14
View File
@@ -37,33 +37,29 @@ const AddColRight = () => (
const DeleteRow = () => ( const DeleteRow = () => (
<svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <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" /> <rect x="2" y="7" width="14" height="4" rx="0.5" 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" /> <path d="M4 3L14 15M14 3L4 15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
</svg> </svg>
); );
const DeleteCol = () => ( const DeleteCol = () => (
<svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <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" /> <rect x="7" y="2" width="4" height="14" rx="0.5" 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" /> <path d="M3 4L15 14M15 4L3 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
</svg> </svg>
); );
const MergeCells = () => ( const MergeCells = () => (
<svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <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" /> <rect x="2" y="4" width="14" height="10" rx="1" stroke="currentColor" stroke-width="1.5" />
<path d="M9 5V13M5 9H13" stroke="currentColor" stroke-width="1" stroke-dasharray="2 2" /> <path d="M6 9H12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
<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" />
</svg> </svg>
); );
const SplitCell = () => ( const SplitCell = () => (
<svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <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" /> <rect x="2" y="4" width="14" height="10" rx="1" stroke="currentColor" stroke-width="1.5" />
<path d="M9 5V13" stroke="currentColor" stroke-width="1.5" /> <path d="M9 7V11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
<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" />
</svg> </svg>
); );
@@ -124,13 +120,13 @@ export const TableBubbleMenu: Component<TableBubbleMenuProps> = (props) => {
actions: [ actions: [
{ label: "Merge Cells", icon: MergeCells, command: () => props.editor.chain().focus().mergeCells().run() }, { 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: "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", name: "Table",
actions: [ 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() },
] ]
} }
]; ];