Non foreignObject SVG export added, fixed bug in png export, added a file for creating a devcontainer and made the project compile #1568
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Made actually compile!
the next thing will be uploaded fonts that are already in b64
tldr: we colone the rect/div with the box shadow, apply a filter on it as before but with a feComposite with operator to out. (this doesn't fill the shape itself, only the shadow outside of it) Rect fill doesn't mater now, so we just use the shadow colour. Insert the clone before the real rect.
added decently working svg rendering
removed the unneeded composite on the shadows
The dom-to-image png renderer had problems with text wrapping, that could lead to unreadable code. This is now solved by rendering the custom svg solution to a canvas and returning that
Fix png problems
|
@TomTom2028 is attempting to deploy a commit to the Carbon Team on Vercel. A member of the Team first needs to authorize it. |
…rything is black on ppt!)
Supported complete tranparancy in powerpoint
AlexAdasCca
added a commit
to AlexAdasCca/carbon
that referenced
this pull request
Jul 7, 2025
AlexAdasCca
added a commit
to AlexAdasCca/carbon
that referenced
this pull request
Jul 7, 2025
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
When exporting an SVG with Carbon, embedding it in software like PowerPoint doesn't work. This is because dom-to-image uses a tag called foreignObject to embed HTML into the SVG, but this feature seems to only be supported in browsers. This issue was resolved by creating the SVG ourselves. Custom font support was added by directly drawing the glyphs onto the SVG.
The PNG export had a bug where text unnecessarily wrapped to the next line. This was fixed by generating an SVG and rendering it onto a canvas.
Importing react-codemirror2 caused server-side errors due to inadequate internal checks in the library to determine if it was running in a browser environment. This was resolved by adding a wrapper that checks if document is defined before requiring the module.
Windows development was not possible before (something to do with the webpack plugin that removes the default codemirror CSS). A devcointainer file was added to mitigate this.
Note: I couldn’t test Twitter export functionality because I lack API keys. If anyone can test this, please let me know if there are issues!