custom CSS classes are rendered to lower-case in tables

[zkamvar]

What version of myst-parser are you using?

4.0.0

What version dependencies are you using?

$ python --version Python 3.10.12

$ pip list | grep -e phinx -e docu -e myst docutils 0.20.1 myst-parser 4.0.0 pydata-sphinx-theme 0.15.4 Sphinx 7.1.2 sphinx-book-theme 1.1.2 sphinx-rtd-theme 2.1.0rc1 sphinxcontrib-applehelp 2.0.0 sphinxcontrib-devhelp 2.0.0 sphinxcontrib-htmlhelp 2.1.0 sphinxcontrib-jquery 4.1 sphinxcontrib-jsmath 1.0.1 sphinxcontrib-qthelp 2.0.0 sphinxcontrib-serializinghtml 2.0.0

What operating system are you using?

Linux

Describe the Bug

I am attempting to add a custom class that uses camelCase to a table.

# example.md

```{table} *title*
:class: .heatMap4

| a | b |
|---|---|
| 1 | 2 |

When I render the table to HTML, the class `heatMap4` renders as `heatmap4` (line 3):

```html
<section id="example-md">
<h1>example.md</h1>
<table class="heatmap4">
<caption><em>title</em></caption>
<thead>
<tr><th class="head"><p>a</p></th>
<th class="head"><p>b</p></th>
</tr>
</thead>
<tbody>
<tr><td><p>1</p></td>
<td><p>2</p></td>
</tr>
</tbody>
</table>
</section>

Expected Behavior

I expected the table to gain the class heatMap4, with a capital M (line 3):

<section id="example-md">
<h1>example.md</h1>
<table class="heatMap4">
<caption><em>title</em></caption>
<thead>
<tr><th class="head"><p>a</p></th>
<th class="head"><p>b</p></th>
</tr>
</thead>
<tbody>
<tr><td><p>1</p></td>
<td><p>2</p></td>
</tr>
</tbody>
</table>
</section>

To Reproduce

1. copy and paste the example into a new markdown file called example.md

   # example.md
   
   ```{table} *title*
   :class: .heatMap4
   
   | a | b |
   |---|---|
   | 1 | 2 |

2. run myst-docutils-demo example.md

[iso2013]

This is a behavior of docutils, a lower-level dependency of Sphinx and MyST-Parser; this case change (and removal of the ., as well) occurs in the class_option function of `docutils.parsers.rst.directives.

(In other words, this is a behavior of reST and Sphinx in general, because it is a behavior of docutils.)

Your best option is unfortunately to just use lower-kebab-case or just put up with it being lowercase.

[zkamvar]

Ah, thank you for the clarification.

For my own (and others) future reference, the make_id() method details that the CSS1 definition for an identifier specifies a regex of [a-z](-?[a-z0-9]+)* along with latin1 characters (see https://www.w3.org/TR/CSS1/#appendix-b), which is why everything gets shoved into lower case despite Section 7.1 saying "All CSS style sheets are case-insensitive, except for parts that are not under the control of CSS. I.e., in CSS1, font family names and URLs can be case-sensitive. Also, the case-sensitivity of the CLASS and ID attributes is under the control of HTML."

I'll go ahead and close this here since it's not a problem with Myst.