fix: TipTap button style extraction when parsing HTML
Added getAttrs functions to parseHTML in tiptap-button-extension.ts. Now properly extracts text/href/style from DOM elements: - data-button: extracts from data-text, data-href, data-style - a.button: extracts text/href, defaults to solid style - a.button-outline: extracts text/href, defaults to outline style This fixes the issue where buttons appeared unstyled (outline instead of solid) when editing a card that contained buttons.
This commit is contained in:
@@ -39,12 +39,27 @@ export const ButtonExtension = Node.create<ButtonOptions>({
|
||||
return [
|
||||
{
|
||||
tag: 'a[data-button]',
|
||||
getAttrs: (node: HTMLElement) => ({
|
||||
text: node.getAttribute('data-text') || node.textContent || 'Click Here',
|
||||
href: node.getAttribute('data-href') || node.getAttribute('href') || '#',
|
||||
style: node.getAttribute('data-style') || 'solid',
|
||||
}),
|
||||
},
|
||||
{
|
||||
tag: 'a.button',
|
||||
getAttrs: (node: HTMLElement) => ({
|
||||
text: node.textContent || 'Click Here',
|
||||
href: node.getAttribute('href') || '#',
|
||||
style: 'solid',
|
||||
}),
|
||||
},
|
||||
{
|
||||
tag: 'a.button-outline',
|
||||
getAttrs: (node: HTMLElement) => ({
|
||||
text: node.textContent || 'Click Here',
|
||||
href: node.getAttribute('href') || '#',
|
||||
style: 'outline',
|
||||
}),
|
||||
},
|
||||
];
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user