-
-
Notifications
You must be signed in to change notification settings - Fork 531
feat: Inline style props in external HTML #1636
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: Inline style props in external HTML #1636
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
@blocknote/ariakit
@blocknote/code-block
@blocknote/core
@blocknote/react
@blocknote/mantine
@blocknote/server-util
@blocknote/shadcn
@blocknote/xl-docx-exporter
@blocknote/xl-multi-column
@blocknote/xl-odt-exporter
@blocknote/xl-pdf-exporter
commit: |
packages/core/src/api/exporters/html/util/serializeBlocksExternalHTML.ts
Outdated
Show resolved
Hide resolved
<div data-editable="" style="white-space: normal;">React Context Paragraph</div> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
why is the white-space added?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is something that's added automatically to the React node view wrapper. Do we need to get rid of it?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
not sure; just wondering why it wasn't there before? (i.e.: what changed in this PR)?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ah, yeah - since we render some props out to inline styles for external HTML, I changed it so inline styles are also preserved (previously only attributes were). The React node view wrapper adds that white space style automatically, so it also gets preserved.
tests/src/unit/core/formatConversion/export/__snapshots__/html/complex/misc.html
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nice fixes!
* Added lossy HTML export/parse equality tests * Fixed list item props in external HTML * Fixed tables in `partialBlockToBlockForTesting` * Added advanced table test * Added comment * feat: Inline style props in external HTML (#1636) * Made default props on default blocks get rendered to inline styles for lossy HTML * Updated unit test snapshots * Implemented PR feedback * Small fix
This PR makes props for default props on default blocks get rendered out to inline styles instead of
data-*
attributes when converting to lossy HTML. This is done in a somewhat hacky way as it only happens for default blocks, though after discussing with @YousefED we decided this was ok for now, and will be fixed when changing our default blocks to use the custom blocks API.No tests have been added in this PR, as the ones we need are already in #1605 and #1635, which this PR branches off of.