Skip to content

Conversation

Hector-Zhuang
Copy link
Contributor

Description:

This PR addresses two issues related to <video> elements in the editor:

Video parsed as an image

Previously, <video> elements were being processed by the image handler in remarkRehype, causing videos to be treated as images.

Video exported as a link in Markdown

When exporting content containing videos to Markdown, the videos were incorrectly serialized as standard link Markdown:

Fixes implemented:

Updated the image handler to detect videos by extension (mp4, webm, etc.) and process them as <video> elements with the correct attributes: src, data-url, data-name and so on.

Added a convertVideoElementToMarkdown plugin to transform <video> elements into a dedicated video markdown with url and title.

#1938

Copy link

vercel bot commented Aug 22, 2025

@Hector-Zhuang is attempting to deploy a commit to the TypeCell Team on Vercel.

A member of the Team first needs to authorize it.

@iyansr
Copy link

iyansr commented Sep 3, 2025

@matthewlipski @nperez0111 @YousefED
Any possibilities to merge this ? We really need

@Hector-Zhuang
Copy link
Contributor Author

@matthewlipski @nperez0111 @YousefED Any possibilities to merge this ? We really need

Try to maintain or fork a repository of this project. This is what I'm doing. I've been fixing bugs while integrating this with my work

Copy link

pkg-pr-new bot commented Sep 4, 2025

Open in StackBlitz

@blocknote/ariakit

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/ariakit@1955

@blocknote/code-block

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/code-block@1955

@blocknote/core

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/core@1955

@blocknote/mantine

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/mantine@1955

@blocknote/react

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/react@1955

@blocknote/server-util

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/server-util@1955

@blocknote/shadcn

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/shadcn@1955

@blocknote/xl-ai

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-ai@1955

@blocknote/xl-docx-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-docx-exporter@1955

@blocknote/xl-email-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-email-exporter@1955

@blocknote/xl-multi-column

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-multi-column@1955

@blocknote/xl-odt-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-odt-exporter@1955

@blocknote/xl-pdf-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-pdf-exporter@1955

commit: 4a2bc9c

Copy link
Contributor

@nperez0111 nperez0111 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's wait for: #1904

@nperez0111
Copy link
Contributor

@iyansr feel free to use the pkg pr new versions that were generated above. They'll include this and some unreleased changes

@iyansr
Copy link

iyansr commented Sep 5, 2025

@iyansr feel free to use the pkg pr new versions that were generated above. They'll include this and some unreleased changes

@nperez0111 I got this when i install from pkg pr
CleanShot 2025-09-05 at 11 56 33

@nperez0111
Copy link
Contributor

nperez0111 commented Sep 5, 2025

@iyansr
This error happens when you have multiple versions of @blocknote/core installed in the same repo. You should update all of the versions to be pkg.pr.new versions, not just one package. Since they depend on each other.

@iyansr
Copy link

iyansr commented Sep 5, 2025

@iyansr This error happens when you have multiple versions of @blocknote/core installed in the same repo. You should update all of the versions to be pkg.pr.new versions, not just one package. Since they depend on each other.

@nperez0111 Should I install all with the pkg.pr.new ?
CleanShot 2025-09-05 at 19 05 12@2x

@nperez0111
Copy link
Contributor

Yep, that should be it @iyansr

@iyansr
Copy link

iyansr commented Sep 5, 2025

Yep, that should be it @iyansr

The issue still exist unfortunately 🥲

@nperez0111
Copy link
Contributor

You likely have duplicates somewhere, look around for duplicate versions using npm ls @blocknote/core or inspect your package-lock, this is your project so I can't help you with it anymore than this

@iyansr
Copy link

iyansr commented Sep 5, 2025

You likely have duplicates somewhere, look around for duplicate versions using npm ls @blocknote/core or inspect your package-lock, this is your project so I can't help you with it anymore than this

Sure, I will try, thanks for helping 🙏

return parts[parts.length - 1];
}

export function isVideoUrl(url: string) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@nperez0111 how do you feel about checking if a file is a video based on a hard coded list of file endings? The alternative would be to get it from the meta.fileBlockAccept field in the video block's implementation. It would be nice to use this instead of a hard coded list, but I'm wary of what happens if someone replaces the default video block with their own. Wdyt?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think hard-coding is fine for now, this is what the markdown parser would've done anyway.

@nperez0111 nperez0111 merged commit 71451f6 into TypeCellOS:main Oct 3, 2025
9 of 12 checks passed
@nperez0111
Copy link
Contributor

Thanks @Hector-Zhuang for this!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants