Skip to content
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

fix(dart) - add highlighting for class and function names #4169

Open
wants to merge 7 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGES.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ Core Grammars:
- fix(nix) don't mix escapes for `"` and `''` strings [h7x4][]
- fix(swift) - Fixed syntax highlighting for class func/var declarations [guuido]
- fix(yaml) - Fixed wrong escaping behavior in single quoted strings [guuido]
- fix(dart) - Added highlighting for class and function names [guuido]

New Grammars:

Expand Down
41 changes: 41 additions & 0 deletions src/languages/dart.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,9 @@ Category: scripting

/** @type LanguageFn */
export default function(hljs) {

const regex = hljs.regex;

const SUBST = {
className: 'subst',
variants: [ { begin: '\\$[A-Za-z0-9_]+' } ]
Expand Down Expand Up @@ -221,6 +224,42 @@ export default function(hljs) {
$pattern: /[A-Za-z][A-Za-z0-9_]*\??/
};

const CAPITALIZED_BUILT_IN_TYPES = BUILT_IN_TYPES.filter(type => /^[A-Z]/.test(type));

const BUILT_IN_TYPES_REGEX = `\\b(${CAPITALIZED_BUILT_IN_TYPES.join('|')})\\b`;

const CLASS_NAME_RE = regex.either(
/\b([A-Z]+[a-z0-9]+)+/,
// ends in caps
/\b([A-Z]+[a-z0-9]+)+[A-Z]+/,
);

const CLASS_REFERENCE = {
relevance: 0,
variants: [
{
// prevent built-in types with capital letter from being selected as title.class
match: BUILT_IN_TYPES_REGEX,
skip: true
Copy link
Member

Choose a reason for hiding this comment

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

Why skip?

Copy link
Member

Choose a reason for hiding this comment

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

Why wouldn't a built-in class also get title.class? That or perhaps built_in I'd think...

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Using this snippet as an example:

class Person {
  String name;
  int age;

  Person(this.name, this.age);
}

Currently the library already marks String as built_in, so I added this regex to prevent String from being matched as title.class. I may have misunderstood what skip is used for (still learning how the library works) - I set skip: true because otherwise String wasn't decorated at all. I thought we wanted to preserve the current behavior, but if it's ok to use title.class for built-in classes I can remove this part

Copy link
Member

Choose a reason for hiding this comment

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

Currently the library already marks String as built_in, so I added this regex to prevent String from being matched as title.class.

Ah, that makes sense.

I think you can skip the skip though... does it work without it?

Copy link
Contributor Author

@guuido guuido Dec 16, 2024

Choose a reason for hiding this comment

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

No, without the skip String is not decorated at all. I've already removed this part because I understood it was ok to mark String with title.class, but if you want I can add it again

},
{
match: CLASS_NAME_RE,
scope: "title.class"
}
]
};

const FUNCTION_REFERENCE = {
relevance: 0,
match: [
/[a-z][A-Za-z0-9]*/,
/\(/
guuido marked this conversation as resolved.
Show resolved Hide resolved
],
className: {
1: "title.function"
},
};

return {
name: 'Dart',
keywords: KEYWORDS,
Expand Down Expand Up @@ -257,6 +296,8 @@ export default function(hljs) {
hljs.UNDERSCORE_TITLE_MODE
]
},
CLASS_REFERENCE,
FUNCTION_REFERENCE,
NUMBER,
{
className: 'meta',
Expand Down
10 changes: 10 additions & 0 deletions test/markup/dart/class.expect.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
<span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">Person</span> </span>{
<span class="hljs-built_in">String</span> name;
<span class="hljs-built_in">int</span> age;

<span class="hljs-title class_">Person</span>(<span class="hljs-keyword">this</span>.name, <span class="hljs-keyword">this</span>.age);

<span class="hljs-keyword">void</span> <span class="hljs-title function_">introduce</span>() {
<span class="hljs-title function_">print</span>(<span class="hljs-string">&#x27;My name is <span class="hljs-subst">$name</span> and I am <span class="hljs-subst">$age</span> years old.&#x27;</span>);
}
}
10 changes: 10 additions & 0 deletions test/markup/dart/class.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
class Person {
String name;
int age;

Person(this.name, this.age);

void introduce() {
print('My name is $name and I am $age years old.');
}
}
11 changes: 11 additions & 0 deletions test/markup/dart/function.expect.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
<span class="hljs-keyword">void</span> <span class="hljs-title function_">greet</span>(<span class="hljs-built_in">String</span> name) {
<span class="hljs-title function_">print</span>(<span class="hljs-string">&#x27;Hello, <span class="hljs-subst">$name</span>!&#x27;</span>);
}

<span class="hljs-keyword">void</span> <span class="hljs-title function_">dummy</span>(<span class="hljs-title class_">Foo</span> obj) {
<span class="hljs-keyword">return</span> obj;
}

<span class="hljs-built_in">int</span> <span class="hljs-title function_">add</span>(<span class="hljs-built_in">int</span> a, <span class="hljs-built_in">int</span> b) {
<span class="hljs-keyword">return</span> a + b;
}
11 changes: 11 additions & 0 deletions test/markup/dart/function.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
void greet(String name) {
print('Hello, $name!');
}

void dummy(Foo obj) {
return obj;
}

int add(int a, int b) {
return a + b;
}