This PR allows you to define `align="right"` for example to change the
default alignment on **HTML** table columns. This PR also refactors
where we store the alignments in order to make it so you can define it
column based instead of only row based.
See that the `Revenue` column is left aligned instead of the default
`centered`.
**Result**
<img width="1161" height="177" alt="Screenshot 2025-10-25 at 11 01 38"
src="https://github.com/user-attachments/assets/94bda4f0-00c1-4726-a3bd-99b3f2573ef5"
/>
**Code example**
```HTML
<table>
<tr>
<th rowspan="2">Region</th>
<th colspan="2" align="left">Revenue</th>
<th rowspan="2">Growth</th>
</tr>
<tr>
<th>Q2 2024</th>
<th>Q3 2024</th>
</tr>
<tr>
<td>North America</td>
<td>$2.8M</td>
<td>$2.4B</td>
<td>+85,614%</td>
</tr>
<tr>
<td>Europe</td>
<td>$1.2M</td>
<td>$1.9B</td>
<td>+158,233%</td>
</tr>
<tr>
<td>Asia-Pacific</td>
<td>$0.5M</td>
<td>$1.4B</td>
<td>+279,900%</td>
</tr>
</table>
```
Release Notes:
- markdown preview: Add support for `HTML` table column `align`
attribute
Closes https://github.com/zed-industries/zed/issues/39837
This PR adds support for `colspan` feature that is only supported for
HTML tables. I also fixed an edge case where the right side border was
not applied because it didn't match the total column count.
**Before**
<img width="725" height="179"
alt="499166907-385cc787-fc89-4e6d-bf06-c72c3c0bd775"
src="https://github.com/user-attachments/assets/69586053-9893-4c92-aa89-7830d2bc7a6d"
/>
**After**
<img width="1165" height="180" alt="Screenshot 2025-10-21 at 22 51 55"
src="https://github.com/user-attachments/assets/f40686e7-d95b-45a6-be42-e226e2f77483"
/>
```html
<table>
<tr>
<th rowspan="2">Region</th>
<th colspan="2">Revenue</th>
<th rowspan="2">Growth</th>
</tr>
<tr>
<th>Q2 2024</th>
<th>Q3 2024</th>
</tr>
<tr>
<td>North America</td>
<td>$2.8M</td>
<td>$2.4B</td>
<td>+85,614%</td>
</tr>
<tr>
<td>Europe</td>
<td>$1.2M</td>
<td>$1.9B</td>
<td>+158,233%</td>
</tr>
<tr>
<td>Asia-Pacific</td>
<td>$0.5M</td>
<td>$1.4B</td>
<td>+279,900%</td>
</tr>
</table>
```
**TODO**:
- [x] Add tests for rending logic
- [x] Test all the tables again
cc @bennetbo
Release Notes:
- Markdown: Added support for `colspan` and `rowspan` for HTML tables
---------
Co-authored-by: Zed AI <ai@zed.nl>
Co-authored-by: Anthony Eid <hello@anthonyeid.me>
Re-adds: https://github.com/zed-industries/zed/pull/37264
This PR re-adds basic support for showing HTML images, without touching
the display mode for images.
The initial PR changed the `div().flex().flex_col()` to
`h_flex().flex_wrap()` but this broke the text wrapping in almost all
cases.
**Note**: This does not add support for showing the images inline,
because we haven't figured out how they correctly do this.
I'm working on adding the CSS `inline` display feature support to taffy
that hopefully allows us to correctly show images/other elements inline
without breaking the text wrapping.
**Before (nightly) and after (dev) for the README file inside Zed.
(nothing has changed, which is good)**
<img width="3440" height="1380" alt="Screenshot 2025-09-13 at 12 49 08"
src="https://github.com/user-attachments/assets/9cbdcb07-dbe9-4236-9d20-e59acc0e955e"
/>
**Result**
<img width="1717" height="1314" alt="Screenshot 2025-09-13 at 12 51 54"
src="https://github.com/user-attachments/assets/1c0f8507-c63d-472e-8e82-a654a63f7153"
/>
cc @SomeoneToIgnore
Release Notes:
- markdown preview: Added support for HTML `img` tags inside paragraphs
This PR adds support for HTML block quotes, that also allows you to have
nested variant of it.
<img width="1441" height="804" alt="Screenshot 2025-10-08 at 10 25 57"
src="https://github.com/user-attachments/assets/4e1da766-fb54-4e87-8654-1ea14330bc97"
/>
Code example used in screenshot:
```html
<blockquote>
<p>
Words can be like X-rays, if you use them properly—they’ll go through
anything. You read and you’re pierced.
</p>
<blockquote>
<p>
lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor.
</p>
</blockquote>
</blockquote>
```
Release Notes:
- Markdown: Added support for `HTML` block quotes
Follow-up: https://github.com/zed-industries/zed/pull/38590
**Note**: this PR contains changes from the [previous
PR](https://github.com/zed-industries/zed/pull/38590), when that PR gets
merged we should see the real changes.
This PR fixes 4 things in order to make:
1. Add html/markdown minifier to remove all the **\t** and **\n**
characters. This is needed as you cannot create new lines with markdown
by just adding an enter to the source file.
2. The event Event::HTML only contained a chunk of the real html for
multiline HTML code. I fixed this by storing the currently watched HTML
inside a buffer and at the end we parse it into the right elements.
Instead of trying to parse a chunck into multiple elements which would
always fail before.
3. Add support for html tables.
4. Fixed panic that occured when table does not have an header.
I also decided to keep the html minifier inside Zed, because making it a
dependency for just a few 100 lines seems to be an overkill. The
original crate had a few cve in their dependencies, so figured this
would be the best.
**Html table support**
<img width="1439" height="801" alt="Screenshot 2025-09-27 at 12 19 07"
src="https://github.com/user-attachments/assets/a884cc6f-cf47-45a2-81fa-91300c7bbf3f"
/>
**Before & after Zed's README (no changes)**
<img width="3440" height="1378" alt="Screenshot 2025-09-27 at 12 34 47"
src="https://github.com/user-attachments/assets/1273b094-fb24-4abd-bffa-56ef3b44670c"
/>
Release Notes:
- Markdown: Added support for html tables
Follow-up: #36700
This PR adds basic support for showing images inline inside a text.
As you can see inside the before screenshot, the image was displayed
right below the `Some inline text` text. This was because we didn't
consider the image to be inline with the text (paragraph). Now we do :)
All the test changes are making sure it is not more than 1 element
parsed, instead of only checking for the first parsed element. This
could work out bad when we return more than 1 result.
**Before**
<img width="1717" height="1344" alt="Screenshot 2025-08-31 at 13 49 45"
src="https://github.com/user-attachments/assets/13c5f9dd-0e0a-4e08-b2a6-28e9a4e0cab8"
/>
**After**
<img width="1719" height="1343" alt="Screenshot 2025-08-31 at 13 42 14"
src="https://github.com/user-attachments/assets/bf7aa82f-3743-4fb3-87aa-4a97a550c4d1"
/>
**Code example**:
```markdown
<p>some inline text <img src="https://picsum.photos/200/300" alt="Description of image" style="height: 100px" /> asdjkflsadjfl</p>
# Html Tag
<img src="https://picsum.photos/200/300" alt="Description of image" />
# Html Tag with width and height
<img src="https://picsum.photos/200/300" alt="Description of image" width="100" height="200" />
# Html Tag with style attribute with width and height
<img src="https://picsum.photos/200/300" alt="Description of image" style="width: 100px; height: 200px" />
# Normal Tag
```
Release Notes:
- Markdown: Added support for inline HTML `img` tags inside paragraphs
This removes around 900 unnecessary clones, ranging from cloning a few
ints all the way to large data structures and images.
A lot of these were fixed using `cargo clippy --fix --workspace
--all-targets`, however it often breaks other lints and needs to be run
again. This was then followed up with some manual fixing.
I understand this is a large diff, but all the changes are pretty
trivial. Rust is doing some heavy lifting here for us. Once I get it up
to speed with main, I'd appreciate this getting merged rather sooner
than later.
Release Notes:
- N/A
Before MarkdownParagraphChunk::Image was pushed for every Text event if
we're currently inside an image. This was wrong since pulldown-cmark
parses `` as:
Start(Image { link_type: Inline, dest_url: "foo", title: "", id: "" })
End(Image)
If there is no alt text, no Text event is emitted. Which caused images
without any alt text not to be rendered at all.
For alt texts containing inline formatting this was even more obviously
broken since e.g. `` gets parsed as:
Start(Image { link_type: Inline, dest_url: "foo", title: "", id: "" })
Text(Borrowed("foo "))
Start(Emphasis)
Text(Borrowed("bar"))
End(Emphasis)
Text(Borrowed(" baz"))
End(Image)
which for this example caused the image to appear 3 times in the
preview.
This commit fixes these two bugs which have existed since the
introduction of the image previews in
96854c68ea.
Release Notes:
- Fixed images in the markdown preview appearing not at all or too
often.
Closes#21534
While investigating the panic, I noticed that the code was pretty
complicated and decided to refactor parts of it to reduce redundancy.
Release Notes:
- Fixed an issue where the app could crash when opening the markdown
preview with a malformed image tag
Follow up to #19785
This PR ensures that we explicitly ignore inline HTML tags so that we
can still extract the text between the tags and show them to the user
Release Notes:
- N/A
- Closes#12515
Before fix:
<img width="1506" alt="Screenshot 2024-10-17 at 09 50 19"
src="https://github.com/user-attachments/assets/250f50cb-0119-4b96-bc9b-7258aa83247c">
After fix:
<img width="1027" alt="Screenshot 2024-10-17 at 09 52 36"
src="https://github.com/user-attachments/assets/c2eb7e4a-3c03-466c-b215-7fcc22eed024">
Testing:
- Manual testing
- Added unit test
Test results, these tests fail on the main branch for my setup as well,
I have docker running but still had some failures:
```
failures:
tests::integration_tests::test_context_collaboration_with_reconnect
tests::integration_tests::test_formatting_buffer
tests::integration_tests::test_fs_operations
tests::integration_tests::test_git_branch_name
tests::integration_tests::test_git_diff_base_change
tests::integration_tests::test_git_status_sync
tests::integration_tests::test_join_after_restart
tests::integration_tests::test_join_call_after_screen_was_shared
tests::integration_tests::test_joining_channels_and_calling_multiple_users_simultaneously
tests::integration_tests::test_leaving_project
tests::integration_tests::test_leaving_worktree_while_opening_buffer
tests::integration_tests::test_local_settings
tests::integration_tests::test_lsp_hover
tests::integration_tests::test_mute_deafen
tests::integration_tests::test_open_buffer_while_getting_definition_pointing_to_it
tests::integration_tests::test_pane_split_left
tests::integration_tests::test_prettier_formatting_buffer
tests::integration_tests::test_preview_tabs
tests::integration_tests::test_project_reconnect
tests::integration_tests::test_project_search
tests::integration_tests::test_project_symbols
tests::integration_tests::test_propagate_saves_and_fs_changes
tests::integration_tests::test_references
tests::integration_tests::test_reloading_buffer_manually
tests::integration_tests::test_right_click_menu_behind_collab_panel
tests::integration_tests::test_room_location
tests::integration_tests::test_room_uniqueness
tests::integration_tests::test_server_restarts
tests::integration_tests::test_unshare_project
tests::notification_tests::test_notifications
tests::random_project_collaboration_tests::test_random_project_collaboration
tests::remote_editing_collaboration_tests::test_sharing_an_ssh_remote_project
test result: FAILED. 156 passed; 32 failed; 0 ignored; 0 measured; 0 filtered out; finished in 100.98s
```
Comments:
I do not have a ton of rust knowledge, so very open to feedback. TYSM
Release Notes:
- Fix Incorrect checkbox placement in Markdown preview
---------
Co-authored-by: Bennet Bo Fenner <bennet@zed.dev>
Before this change, `parse_block` was consuming events that it doesn't
handle. This was fine in its use in `parse_document`, but in its use in
`parse_list` this broke when there is an empty list item, causing it to
consume list end tags / list item starts / etc.
Release Notes:
- Fixed markdown preview rendering of empty list items.
This PR disables definition list support in `pulldown_cmark`, as it is
has been causing a number of issues.
I opened an issue upstream with the panic we were seeing:
https://github.com/pulldown-cmark/pulldown-cmark/issues/957.
Release Notes:
- N/A
Fixes a panic related to rendering checkboxes, see #10824.
Currently we are rendering a list into a single block, meaning the whole
block has to be rendered when it is visible on screen. This would lead
to performance problems when a single list block contained a lot of
items (especially if it contained checkboxes). This PR splits up list
items into separate blocks, meaning only the actual visible list items
on screen get rendered, instead of the whole list.
A nice side effect of the refactoring is, that you can actually click on
individual list items now:
https://github.com/zed-industries/zed/assets/53836821/5ef4200c-bd85-4e96-a8bf-e0c8b452f762
Release Notes:
- Improved rendering performance of list elements inside the markdown
preview
---------
Co-authored-by: Remco <djsmits12@gmail.com>
This PR contains various improvements for the markdown preview (some of
which were originally part of #7601).
Some improvements can be seen in the video (see also release notes down
below):
https://github.com/zed-industries/zed/assets/53836821/93324ee8-d366-464a-9728-981eddbfdaf7
Release Notes:
- Added action to open markdown preview in the same pane
- Added support for displaying channel notes in markdown preview
- Added support for displaying the current active editor when opening
markdown preview
- Added support for scrolling the editor to the corresponding block when
double clicking an element in markdown preview
- Improved pane creation handling when opening markdown preview
- Fixed markdown preview displaying non-markdown files
Closes#5178
Release Notes:
- Added a `file_types` setting that can be used to associate languages
with file names and file extensions. For example, to interpret all `.c`
files as C++, and files called `MyLockFile` as TOML, add the following
to `settings.json`:
```json
{
"file_types": {
"C++": ["c"],
"TOML": ["MyLockFile"]
}
}
```
As with most zed settings, this can be configured on a per-directory
basis by including a local `.zed/settings.json` file in that directory.
---------
Co-authored-by: Marshall <marshall@zed.dev>
This PR improves support for rendering markdown documents.
## After the updates
https://github.com/zed-industries/zed/assets/18583882/48315901-563d-44c6-8265-8390e8eed942
## Before the updates
https://github.com/zed-industries/zed/assets/18583882/6d7ddb55-41f7-492e-af12-6ab54559f612
## New features
- @SomeoneToIgnore's [scrolling feature
request](https://github.com/zed-industries/zed/pull/6958#pullrequestreview-1850458632).
- Checkboxes (`- [ ]` and `- [x]`)
- Inline code blocks.
- Ordered and unordered lists at an arbitrary depth.
- Block quotes that render nested content, like code blocks.
- Lists that render nested content, like code blocks.
- Block quotes that support variable heading sizes and the other
markdown features added
[here](https://github.com/zed-industries/zed/pull/6958).
- Users can see and click internal links (`[See the docs](./docs.md)`).
## Notable changes
- Removed dependency on `rich_text`.
- Added a new method for parsing markdown into renderable structs. This
method uses recursive descent so it can easily support more complex
markdown documents.
- Parsing does not happen for every call to
`MarkdownPreviewView::render` anymore.
## TODO
- [ ] Typing should move the markdown preview cursor.
## Future work under consideration
- If a title exists for a link, show it on hover.
- Images.
- Since this PR brings the most support for markdown, we can consolidate
`languages/markdown` and `rich_text` to use this new renderer. Note that
the updated inline text rendering method in this PR originated from
`langauges/markdown`.
- Syntax highlighting in code blocks.
- Footnote references.
- Inline HTML.
- Strikethrough support.
- Scrolling improvements:
- Handle automatic preview scrolling when multiple cursors are used in
the editor.
- > great to see that the render now respects editor's scrolls, but can
we also support the vice-versa (as syntax tree does it in Zed) — when
scrolling the render, it would be good to scroll the editor too
- > sometimes it's hard to understand where the "caret" on the render
is, so I wonder if we could go even further with its placement and place
it inside the text, as a regular caret? Maybe even support the
selections?
- > switching to another markdown tab does not change the rendered
contents and when I call the render command again, the screen gets
another split — I would rather prefer to have Zed's syntax tree
behavior: there's always a single panel that renders things for whatever
tab is active now. At least we should not split if there's already a
split, rather adding the new rendered tab there.
- > plaintext URLs could get a highlight and the click action
## Release Notes
- Improved support for markdown rendering.
Lukas Wirth
Remco SmitsandBennet Bo Fenner
Bartosz Kaszubowski
Kirill Bulatov
tidely
Piotr Osiewicz
Smit Barmase
Nils Koch
Martin Fischer
Bennet Bo Fenner
Daniel EichmanandBennet Bo Fenner
Michael Sloan
Marshall Bowers
Bennet Bo FennerandRemco
Kieran Gill