Move general type identifier rules before class-specific ones to ensure
proper precedence in the syntax highlighting query.
Closes#49226.
Before you mark this PR as ready for review, make sure that you have:
- [ ] Added a solid test coverage and/or screenshots from doing manual
testing
- [x] Done a self-review taking into account security and performance
aspects
- [x] Aligned any UI changes with the [UI
checklist](https://github.com/zed-industries/zed/blob/main/CONTRIBUTING.md#uiux-checklist)
Release Notes:
- Fixed an issue where class names were not highlighted correctly in
JavaScript files
HTML character references like `·`, `'`, and `{` are
correctly parsed by tree-sitter as named nodes
(`html_character_reference` in TSX/JavaScript, `entity` in HTML), but no
highlight query captures them. This means they render as plain,
unhighlighted text in the editor.
This PR adds one-line highlight captures for each:
- **TSX** (`crates/languages/src/tsx/highlights.scm`):
`(html_character_reference) @string.special`
- **JavaScript** (`crates/languages/src/javascript/highlights.scm`):
`(html_character_reference) @string.special`
- **HTML** (`extensions/html/languages/html/highlights.scm`): `(entity)
@string.special`
`@string.special` is already styled by all built-in themes (One Dark,
Ayu, Gruvbox, etc.), so no theme changes are needed.
Release Notes:
- Added syntax highlighting for HTML character references (`·`,
`'`, `{`, etc.) in TSX, JavaScript, and HTML files.
Fixes an issue where syntax highlighting would be incorrect in certain
cases for JS, because of duplicate keyword definitions.
Release Notes:
- Fixed issue where certain keywords were incorrectly highlighted in JS
files
Improve syntax highlighting of keywords by creating groups for
declarations and import/export.
### Release Notes:
- Highlight declarations with `keyword.declaration`:
- const
- let
- var
- function
- class
- enum
- interface
- type
- Highlight imports and exports with `keyword.import`:
- export
- from
- import
---------
Co-authored-by: Gaauwe Rombouts <mail@grombouts.nl>
Many editors such as vim and emacs support "modelines", a comment at the
beginning of the file that allows the file type to be explicitly
specified along with per-file specific settings
- The amount of configurations, style and settings mapping cannot be
handled in one go, so this opens up a lot of potential improvements.
- I left out the possiblity to have "zed" specific modelines for now,
but this could be potentially interesting.
- Mapping the mode or filetype to zed language names isn't obvious
either. We may want to make it configurable.
This is my first contribution to zed, be kind. I struggled a bit to find
the right place to add those settings. I use a similar approach as done
with editorconfig (merge_with_editorconfig). There might be better ways.
Closes#4762
Release Notes:
- Add basic emacs/vim modeline support.
Supersedes #41899, changes:
- limit reading to the first and last 1kb
- add documentation
- more variables handled
- add Arc around ModelineSettings to avoid extra cloning
- changed the way mode -> language mapping is done, thanks to
`modeline_aliases` language config
- drop vim ex: support
- made "Local Variables:" handling a separate commit, so we can drop it
easily
- various code style improvements
---------
Signed-off-by: Marc-André Lureau <marcandre.lureau@redhat.com>
Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Conrad Irwin <conrad.irwin@gmail.com>
Closes#46701
This ports the fixes from #46442 over to the JavaScript highlights,
which we forgot to do in that PR since the highlights are not shareable
and the fix was only applied to TSX... Hence, porting the fixes here
manually to solve the issue for good.
Release Notes:
- Fixed an issue where JSX components were highlighted too broadly,
causing normal HTML tags to be highlighted as such
Embeddings have neither been used nor maintained in over a year and
there are currently no plans to use these again any time soon. Hence,
remove support for these here to more clearly indicate that these are
actually not used.
Release Notes:
- N/A
Closes#45251
In https://github.com/zed-industries/zed/pull/44532 the syntax
highlighting of JS/TS was improved, but we only used `type.builtin` for
a specific case. This resulted in less consistent syntax highlighting.
Not all themes have this specific token and we don't use `type.builtin`
in other places either, so while this is a little less specific it is
more consistent.
Release Notes:
- Improved syntax highlighting consistency for builtins in JavaScript
and TypeScript
Reverts zed-industries/zed#43437
Internally we noticed some regression related to removed query for
PascalCase identifiers. Reverting now to prevent this from going to
preview, still planning to land this with the necessary fixes later.
This pull request enhances syntax highlighting for JavaScript,
TypeScript, TSX, and JSDoc by adding more precise rules for parameters,
types, and punctuation.
- Added queries for highlighting parameters (`@variable.parameter`)
- Expanded highlighting for type identifiers, type aliases, interfaces,
classes
- Extended/implemented types to improve distinction between different
type constructs (`@type`, `@type.class`)
- Added highlighting for punctuation in type parameters, unions,
intersections, annotations, index signatures, optional fields, and
predicates (`@punctuation.special`, `@punctuation.bracket`)
- Added highlighting for identifiers in JSDoc comments
(`@variable.jsdoc`)
Release Notes:
- Refined syntax highlighting in JavaScript and TypeScript for better
visual distinction of
types, parameters, and JSDoc elements
Deals with https://github.com/zed-industries/zed/issues/5259
Highlights brackets with different colors based on their depth.
Uses existing tree-sitter queries from brackets.scm to find brackets,
uses theme's accents to color them.
https://github.com/user-attachments/assets/cc5f3aba-22fa-446d-9af7-ba6e772029da
1. Adds `colorize_brackets` language setting that allows, per language
or globally for all languages, to configure whether Zed should color the
brackets for a particular language.
Disabled for all languages by default.
2. Any given language can opt-out a certain bracket pair by amending the
brackets.scm like `("\"" @open "\"" @close) ` -> `(("\"" @open "\""
@close) (#set! rainbow.exclude))`
3. Brackets are using colors from theme accents, which can be overridden
as
```jsonc
"theme_overrides": {
"One Dark": {
"accents": ["#ff69b4", "#7fff00", "#ff1493", "#00ffff", "#ff8c00", "#9400d3"]
}
},
```
Release Notes:
- Added bracket colorization (rainbow brackets) support. Use
`colorize_brackets` language setting to enable.
---------
Co-authored-by: MrSubidubi <dev@bahn.sh>
Co-authored-by: Lukas Wirth <lukas@zed.dev>
Co-authored-by: MrSubidubi <finn@zed.dev>
Co-authored-by: Lukas Wirth <me@lukaswirth.dev>
Co-authored-by: Smit Barmase <heysmitbarmase@gmail.com>
Adds debugger inline values support for JavaScript, TypeScript, and TSX languages.
Release Notes:
- debugger: Add inline value support for Javascript, TypeScript, and TSX
---------
Co-authored-by: Anthony <anthony@zed.dev>
Release Notes:
- Added comment language injections for builtin languages. This enables
highlighting of `TODO`s and similar notes with the comment extension
installed.
Signed-off-by: Donnie Adams <donnie@thedadams.com>
Related to #9461, inspired by #39683
`await` and `yield` both seem somewhat debatable on whether they should
be considered the be control flow keywords.
For now I went with:
- `await`: no – The control flow effect of `await` is at a level does
not seem relevant for syntax highlighting.
- `yield`: yes – `yield` directly affects the output of a generator, and
is also included for consistency with Rust (#39683).
Happy to change these either direction.
<img width="1151" height="730" alt="SCR-20251008-izus"
src="https://github.com/user-attachments/assets/533ea670-863a-4c5c-aaa5-4a9bfa0bf0dd"
/>
---
Release Notes:
- Improved granularity of keyword highlighting for JS/TS/TSX: Themes can
now specify `keyword.control` for control flow keywords like `if`,
`else`, `return`, etc.
This reverts commit 19e4cb620e.
We found that #38411 caused problems where anonymous functions are
included too many times in the outline. We'd like to figure out a better
fix before shipping this to stable.
Fixes#38956
Release Notes:
- (preview only) revert changes to outline view
Required for https://github.com/isographlabs/isograph/pull/568 to work
properly. Tested with a local build and made sure everything's working
great!
Release Notes:
- JavaScript/TypeScript/JSX: Added support for injecting Isograph language support into `iso`
function calls
This PR adds the ability for a user to select one or more blocks of text
and wrap each selection in an HTML tag — which works by placing multiple
cursors inside the open and close tags so the appropriate element name
can be typed in to all places simultaneously.
This is similar to the emmet "Wrap with Abbreviation" functionality
discussed in #15588 but is a simpler version that does not rely on
Emmet's language server.
Here's a preview of the feature in action:
https://github.com/user-attachments/assets/1931e717-136c-4766-a585-e4ba939d9adf
Some notes and questions:
- The current implementation is a hardcoded with regards to supported
languages. I'd love some direction on how much of this information to
push into the relevant language structs.
- I can see this feature as something that languages added by an
extension would want to enable support for — is this something you'd
want?
- The syntax is hardcoded to support HTML/XML/JSX-like languages. I
don't suppose this is a problem but figured I'd point it out anyway.
- I called it "Wrap in tag" but open to whatever naming you feel is
appropriate.
- The implementation doesn't use `manipulate_lines` — I wasn't sure how
make use of that without extra overhead / bookkeeping — does this seem
fine?
- I could also investigate adding wrap in abbreviation support by
communicating with the Emmet language server but I think I'll need some
direction on how to handle Emmet's custom LSP message. I could do this
either in addition to or instead of this feature — though imo this
feature is a nice "shortcut" regardless.
Release Notes:
- Added a new "Wrap Selections in Tag" action that lets you wrap one or
more selections in tags based on language. Works in HTML, JSX, and
similar languages, and places cursors inside both opening and closing
tags so you can type the tag name once and apply it everywhere.
---------
Co-authored-by: Smit Barmase <heysmitbarmase@gmail.com>
An alternative might be to adjust the logic to not nest items when their
ranges are the same, but then clicking them doesn't work properly /
moving the cursor does not change which is selected. This could probably
be made to work with some extra logic there, but it seems overkill.
The downside of fixing it at the query level is that other parts of the
declaration are not inside the item range. This seems to be fine for
single line declarations - the nearest outline item is highlighted.
However, if a part of the declaration is not included in an item range
and is on its own line, then no outline item is highlighted.
Release Notes:
- Outline Panel: Fixed nesting of var and field declarations with
multiple identifiers in Go and C++
C++ before:
<img width="743" height="227" alt="image"
src="https://github.com/user-attachments/assets/af1a1d76-ecdc-4999-ae9c-95591726ccca"
/>
C++ after:
<img width="795" height="250" alt="image"
src="https://github.com/user-attachments/assets/49667ed3-e088-48b3-a9f0-6a119b5e7648"
/>
Go before:
<img width="859" height="306" alt="image"
src="https://github.com/user-attachments/assets/ecc7530a-ca16-4f37-b8d1-60687f178b12"
/>
Go after:
<img width="900" height="334" alt="image"
src="https://github.com/user-attachments/assets/d741cfb0-59e5-4d27-bd6a-f422204dc972"
/>
Previously, this was the one thing that could not be styled properly in
ecmascript languages in the zed config, because it was not able to be
targeted.
Now, it is added alongside other operators. This has been tested and
works as expected.
Release Notes:
- N/A
As suggested in https://github.com/zed-industries/zed/pull/34418, this
proposes various changes to language configs to make block comments and
doc-block-style comments more similar. In doing so, it introduces some
breaking changes into the extension schema.
This change is needed to support the changes I'm working on in #34418,
to be able to support `rewrap` in block comments like `/* really long
comment ... */`. As is, we can do this in C-style doc-block comments (eg
`/** ... */`) because of the config in `documentation`, but we can't do
this in regular block comments because we lack the info about what the
line prefix and indentation should be.
And while I was here, I did various other clean-ups, many of which feel
nice but are optional.
I would love special attention on the changes to the schema, version and
related changes; I'm totally unfamiliar with that part of Zed.
**Summary of changes**
- break: changes type of `block_comment` to same type as
`documentation_comment` (**this is the important change**)
- break: rename `documentation` to `documentation_comment` (optional,
but improves consistency w/ `line_comments` and `block_comment`)
- break/refactor?: removes some whitespace in the declaration of
`block_comment` delimiters (optional, may break things, need input; some
langs had no spaces, others did)
- refactor: change `tab_size` from `NonZeroU32` to just a `u32` (some
block comments don't seem to need/want indent past the initial
delimiter, so we need this be 0 sometimes)
- refactor: moves the `documentation_comment` declarations to appear
next to `block_comment`, rearranges the order of the fields in the TOML
for `documentation_comment`, rename backing `struct` (all optional)
**Future scope**
I believe that this will also allow us to extend regular block comments
on newline – as we do doc-block comments – but I haven't looked into
this yet. (eg, in JS try pressing enter in both of these: `/* */` and
`/** */`; the latter should extend w/ a `*` prefixed line, while the
former does not.)
Release Notes:
- BREAKING CHANGE: update extension schema version from 1 to 2, change
format of `block_comment` and rename `documentation_comment`
/cc @smitbarmase
Functions like `function* iterateElements() {}` would not show up in the
editor's navigation outline. With this change, they do.
| **Before** | **After**
|-|-|
|<img width="453" height="280" alt="Screenshot 2025-07-13 at 4 58 22 PM"
src="https://github.com/user-attachments/assets/822f0774-bda2-4855-a6dd-80ba82fffaf3"
/>|<img width="564" height="373" alt="Screenshot 2025-07-13 at 4 58
55 PM"
src="https://github.com/user-attachments/assets/f4f6b84f-cd26-49b7-923b-724860eb18ad"
/>|
Note that I decided to use Zed's agent assistance features to do this PR
as a sort of test run. I don't normally code with an AI assistant, but
figured it might be good in this case since I'm unfamiliar with the
codebase. I must say I was fairly impressed. All the changes in this PR
were done by Claude Sonnet 4, though I have done a manual review to
ensure the changes look sane and tested the changes by running the
re-built `zed` binary with a toy project.
Closes#21631
Release Notes:
- Fixed JS/TS outlines to show generator functions.
Closes#33703
`template_string` consists of `template_substitution` and
`string_fragment` chunks. `template_substitution` should not be
considered a string.
```ts
const variable = `this is a string_fragment but ${this.is.template_substitution}`;
```
Release Notes:
- Fixed auto-complete not showing on typing `.` character in template
literal string in JavaScript and TypeScript files.
Closes#27998
Also fixed an issue where jumping back from closing to opening tags
didn't work in javascript due to missing brackets in our tree-sitter
query.
Release Notes:
- N/A
---------
Co-authored-by: Conrad Irwin <conrad.irwin@gmail.com>
This is the first step of ["Solution proposal for folding multiline
comments with no
indentation"](https://github.com/zed-industries/zed/discussions/31395):
> 1. Add block_comment in the config.toml for the languages javascript,
typescript, tsx. These are simple languages for this feature, and I am
already familiar with them.
The next step will be:
> 2. Modify the function `crease_for_buffer_row` in `DisplaySnapshot` to
handle multiline comments. `editor::fold` and `editor::fold_all` will
handle multiline comments after this change. To my knowledge,
`editor::unfold`, `editor::unfold_all`, and the **unfold** indicator in
the gutter will already work after folding, but there will be no
**fold** indicator.
Release Notes:
- N/A
Follow up for https://github.com/zed-industries/zed/pull/30768
This PR makes JSDoc auto comment on new line lot better by:
- Inserting delimiters regardless of whether previous delimiters have
trailing spaces or not
- When on start tag, auto-indenting both prefix and end tag upon new
line
This makes it correct as per convention out of the box. No need to
manually adjust spaces on every new line.
https://github.com/user-attachments/assets/81b8e05a-fe8a-4459-9e90-c8a3d70a51a2
Release Notes:
- Improved JSDoc auto-commenting on newline which now correctly indents
as per convention.
- Languages now define their preferred debuggers in `config.toml`.
- `LanguageRegistry` now exposes language config even for languages that
are not yet loaded. This necessitated extension registry changes (we now
deserialize config.toml of all language entries when loading new
extension index), but it should be backwards compatible with the old
format. /cc @maxdeviant
Release Notes:
- N/A
---------
Co-authored-by: Anthony Eid <hello@anthonyeid.me>
Co-authored-by: Remco Smits <djsmits12@gmail.com>
Co-authored-by: Anthony <anthony@zed.dev>
Closes#18581
Now characters for completing query and word characters, which are
responsible for selecting words by double clicking or navigating, are
different. This fixes a bunch of things:
For settings.json, this improves completions to treat the whole string
as a completion query, instead of just the last word. We now added
"space" as a completion query character without it being a word
character.
For keymap.json, this improves selecting part of an action as the ":"
character is only a completion character and not a word character. So,
completions would still trigger on ":" and query capture will treat ":"
as a word, but for actions like selections and navigation, ":" will be
treated as punctuation.
Before:
Unnecessary related suggestions as query is only the last word which is
"d".
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/8199a715-7521-49dd-948b-e6aaed04c488"
/>
Double clicking `ToggleFold` selects the whole action:
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/c7f91a6b-06d5-45b6-9d59-61a1b2deda71"
/>
After:
Now query is "one d" and it shows only matched ones.
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/1455dfbc-9906-42e8-b8aa-b3f551194ca2"
/>
Double clicking `ToggleFold` only selects part of the action, which is
more refined behavior.
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/34b1c3c2-184f-402f-9dc8-73030a8c370f"
/>
Release Notes:
- Improved autocomplete suggestions in `settings.json`, now whole string
is queried instead of just last word of string, which filters out lot of
false positives.
- Improved selection of action in `keymap.json`, where now you can
double click to only select certain part of action, instead of selecting
whole action.
---------
Co-authored-by: Max Brunsfeld <maxbrunsfeld@gmail.com>
Co-authored-by: Ben Kunkle <ben@zed.dev>
Reverts zed-industries/zed#25135
This approach was not the best as explained in the response to the
original PR. Likely, the better approach is to create a newer specific
scope for these kinds of variables under the `@variable` prefix so that
themes can control these pseudo-keywords specifically
Closes#4271
Implemented by kicking of a task on the main thread at the end of
`Editor::handle_input` which waits for the buffer to be re-parsed before
checking if JSX tag completion possible based on the recent edits, and
if it is then it spawns a task on the background thread to generate the
edits to be auto-applied to the buffer
Release Notes:
- Added support for auto-closing of JSX tags
---------
Co-authored-by: Cole Miller <cole@zed.dev>
Co-authored-by: Max Brunsfeld <max@zed.dev>
Co-authored-by: Marshall Bowers <git@maxdeviant.com>
Co-authored-by: Mikayla <mikayla@zed.dev>
Co-authored-by: Peter Tripp <peter@zed.dev>
Closes#19267
Adds highlight field specifically for `constructor` in JS/TS/TSX so that
it can be highlighted as a different color than regular methods
Release Notes:
- N/A
---------
Co-authored-by: Ben Kunkle <ben@zed.dev>
Finn Evers