Allow setting HTML tags other than <span> for "as" in MarkViewContent (#6346)

* fix: Allow setting HTML tags other than <span> for "as" in MarkView

* Create quiet-falcons-study.md
This commit is contained in:
Tada Sayuri 2025-05-14 00:30:41 +09:00 committed by GitHub
parent 7147fdd970
commit 2ea0475518
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 12 additions and 5 deletions

View File

@ -0,0 +1,5 @@
---
"@tiptap/react": patch
---
Allow setting HTML tags other than <span> for "as" in MarkViewContent

View File

@ -16,16 +16,18 @@ export const ReactMarkViewContext = React.createContext<MarkViewContextProps>({
}) })
export type MarkViewContentProps<T extends keyof React.JSX.IntrinsicElements = 'span'> = { export type MarkViewContentProps<T extends keyof React.JSX.IntrinsicElements = 'span'> = {
as?: NoInfer<T> as?: T
} & React.ComponentProps<T> } & Omit<React.ComponentProps<T>, 'as'>
export const MarkViewContent: React.FC<MarkViewContentProps> = props => { export const MarkViewContent = <T extends keyof React.JSX.IntrinsicElements = 'span'>(
const Tag = props.as || 'span' props: MarkViewContentProps<T>,
) => {
const { as: Tag = 'span', ...rest } = props
const { markViewContentRef } = React.useContext(ReactMarkViewContext) const { markViewContentRef } = React.useContext(ReactMarkViewContext)
return ( return (
// @ts-ignore // @ts-ignore
<Tag {...props} ref={markViewContentRef} data-mark-view-content="" /> <Tag {...rest} ref={markViewContentRef} data-mark-view-content="" />
) )
} }