I have code like this:

{% highlight jsx %}
function Pagination(props, children) {
   var list = [];
   var _class;
   for (var i=0; i<props.size; i++) {
      if (i == props.selected) {
        _class = 'selected';
      } else {
        _class = '';
      }
      list.push(<li class={_class}>{i}</li>);
   }
   return (<ul>{list}</ul>);
}
{% endhighlight %}

and the output in jekyll blog post, look like this:

white with red have class "err".

I'm enjoying using this in my Sphinx documentation. I do TypeScript with React and many things seem to work, but this for example fails:

class BlogPost extends React.Component<ICounterProps, ICounterState> {
}

...whereas this works:

class BlogPost extends React.Component<{}, {}> {
}

I can make a PR with a failing test if it helps.

The code is as follows:

<BarberImage {...getRootProps()} profileImageURL={newBarber.profileImageURL}>
    <input {...getInputProps()} />
    <Upload height={40} />
</BarberImage>

The syntax highlight when compiling LaTeX is

It looks like it fails to recognize the function inside the prop spreading

I have just tried building jsx-lexer and running the test suite. Unfortunately, one of the tests fails:

=================================== FAILURES ===================================
_______________________ JsxLexerTestCase.test_get_tokens _______________________

self = <tests.test_lexer.JsxLexerTestCase testMethod=test_get_tokens>

    def test_get_tokens(self):
        lexer = lexers.get_lexer_by_name("jsx")
        tokens = lexer.get_tokens(text)
>       self.assertEqual([i for i in tokens], expected_tokens)
E       AssertionError: Lists differ: [(Tok[638 chars]mber.Float, '10'), (Token.Punctuation, ')'), ([8499 chars]\n')] != [(Tok[638 chars]mber.Integer, '10'), (Token.Punctuation, ')'),[8503 chars]\n')]
E       
E       First differing element 25:
E       (Token.Literal.Number.Float, '10')
E       (Token.Literal.Number.Integer, '10')
E       
E       Diff is 10464 characters long. Set self.maxDiff to None to see it.

tests/test_lexer.py:38: AssertionError

I'm using pygments version 2.7.1, the current jsx-lexer (version 0.8.0) and Python 3.9. Somewhere, at least one of them is giving an output different from that expected by jsx-lexer.

I'm using this with minted, and I get results that look like this:

It almost looks like an attribute with a value pops all the way back out into normal JS? I'm not really sure what's going on here, I've been tinkering with the expressions a bit but nothing I've tried has had an effect.

When I attempt to highlight the following code snippet using Sphinx, MyST, and jsx-lexer, Sphinx returns a warning:

WARNING: Could not lex literal_block as "jsx". Highlighting skipped.

```jsx
import React from 'react';

const View = props => {
  return <div>I'm the Block view component!</div>;
};

export default View;
```

FWIW, if I try js as the lexer, it also does not lex.

See plone/volto#3038

Hallo
how i can do set jsx language as {lexer.py:JsxLexer -x} with tcblisting, so normally one writes like this :
\begin{minted}{lexer.py:JsxLexer -x}
but if I want to do with tcblisting instead, what should the code look like?

\begin{tcblisting}{
colback=bg,
breakable,
listing only,
minted language= ? ,
minted options={breaklines}}

Here’s the upstream Pygments TypeScriptLexer working as normal:

$ python
Python 3.8.10 (default, Mar 13 2023, 10:26:41) 
[GCC 9.4.0] on linux
Type "help", "copyright", "credits" or "license" for more information.
>>> import pygments, pygments.lexers
>>> print(*pygments.lex("let m: Map<K, V>;", pygments.lexers.TypeScriptLexer()), sep='\n')
(Token.Keyword.Declaration, 'let')
(Token.Text.Whitespace, ' ')
(Token.Name.Other, 'm')
(Token.Operator, ':')
(Token.Text.Whitespace, ' ')
(Token.Keyword.Type, 'Map')
(Token.Operator, '<')
(Token.Name.Other, 'K')
(Token.Punctuation, ',')
(Token.Text.Whitespace, ' ')
(Token.Name.Other, 'V')
(Token.Operator, '>')
(Token.Punctuation, ';')
(Token.Text.Whitespace, '\n')

But if I start a new Python process and instead import jsx before the first time I use TypeScriptLexer, TypeScriptLexer incorrectly produces Token.Error tokens:

$ python
Python 3.8.10 (default, Mar 13 2023, 10:26:41) 
[GCC 9.4.0] on linux
Type "help", "copyright", "credits" or "license" for more information.
>>> import pygments, pygments.lexers, jsx
>>> print(*pygments.lex("let m: Map<K, V>;", pygments.lexers.TypeScriptLexer()), sep='\n')
(Token.Keyword.Declaration, 'let')
(Token.Text.Whitespace, ' ')
(Token.Name.Other, 'm')
(Token.Operator, ':')
(Token.Text.Whitespace, ' ')
(Token.Keyword.Type, 'Map')
(Token.Punctuation, '<')
(Token.Name.Tag, 'K')
(Token.Error, ',')
(Token.Text, ' ')
(Token.Name.Attribute, 'V')
(Token.Punctuation, '>')
(Token.Punctuation, ';')
(Token.Text.Whitespace, '\n')

This is because jsx-lexer destructively mutates pygments.lexers.javascript.JavascriptLexer.tokens which doesn’t belong to it: