Skip to content

KaTeX(6/n): Handle 'nulldelimiter' class in spans #1633

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.

Sign up for GitHub

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

Merged
merged 1 commit into from
Aug 18, 2025
+55 −1
Merged

KaTeX(6/n): Handle 'nulldelimiter' class in spans #1633

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
16 changes: 15 additions & 1 deletion lib/model/katex.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -386,6 +386,7 @@ class _KatexParser {
final spanClasses = element.className != ''
? List<String>.unmodifiable(element.className.split(' '))
: const <String>[];
double? widthEm;
String? fontFamily;
double? fontSizeEm;
KatexSpanFontWeight? fontWeight;
Expand Down Expand Up @@ -576,7 +577,11 @@ class _KatexParser {
_ => throw _KatexHtmlParseError(),
};

// TODO handle .nulldelimiter and .delimcenter .
case 'nulldelimiter':
// .nulldelimiter { display: inline-block; width: 0.12em; }
widthEm = 0.12;

// TODO .delimcenter .

case 'op-symbol':
// .op-symbol { ... }
Expand Down Expand Up @@ -621,6 +626,7 @@ class _KatexParser {

final inlineStyles = _parseInlineStyles(element);
final styles = KatexSpanStyles(
widthEm: widthEm,
fontFamily: fontFamily,
fontSizeEm: fontSizeEm,
fontWeight: fontWeight,
Expand Down Expand Up @@ -810,6 +816,8 @@ class KatexSpanColor {

@immutable
class KatexSpanStyles {
final double? widthEm;

// TODO(#1674) does height actually appear on generic spans?
// In a corpus, the only occurrences that we don't already handle separately
// (i.e. occurrences other than on struts, vlists, etc) seem to be within
Expand All @@ -834,6 +842,7 @@ class KatexSpanStyles {
final KatexSpanColor? color;

const KatexSpanStyles({
this.widthEm,
this.heightEm,
this.topEm,
this.marginRightEm,
Expand All @@ -849,6 +858,7 @@ class KatexSpanStyles {
@override
int get hashCode => Object.hash(
'KatexSpanStyles',
widthEm,
heightEm,
topEm,
marginRightEm,
Expand All @@ -864,6 +874,7 @@ class KatexSpanStyles {
@override
bool operator ==(Object other) {
return other is KatexSpanStyles &&
other.widthEm == widthEm &&
other.heightEm == heightEm &&
other.topEm == topEm &&
other.marginRightEm == marginRightEm &&
Expand All @@ -879,6 +890,7 @@ class KatexSpanStyles {
@override
String toString() {
final args = <String>[];
if (widthEm != null) args.add('widthEm: $widthEm');
if (heightEm != null) args.add('heightEm: $heightEm');
if (topEm != null) args.add('topEm: $topEm');
if (marginRightEm != null) args.add('marginRightEm: $marginRightEm');
Expand All @@ -893,6 +905,7 @@ class KatexSpanStyles {
}

KatexSpanStyles filter({
bool widthEm = true,
bool heightEm = true,
bool verticalAlignEm = true,
bool topEm = true,
Expand All @@ -906,6 +919,7 @@ class KatexSpanStyles {
bool color = true,
}) {
return KatexSpanStyles(
widthEm: widthEm ? this.widthEm : null,
heightEm: heightEm ? this.heightEm : null,
topEm: topEm ? this.topEm : null,
marginRightEm: marginRightEm ? this.marginRightEm : null,
Expand Down
3 changes: 3 additions & 0 deletions lib/widgets/katex.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,6 +160,9 @@ class _KatexSpan extends StatelessWidget {
}

widget = SizedBox(
width: styles.widthEm != null
? styles.widthEm! * em
: null,
height: styles.heightEm != null
? styles.heightEm! * em
: null,
Expand Down
33 changes: 33 additions & 0 deletions test/model/katex_test.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -643,6 +643,38 @@ class KatexExample extends ContentExample {
text: '∗'),
]),
]);

static final nulldelimiter = KatexExample.block(
r'null delimiters, like `\left.`',
// https://chat.zulip.org/#narrow/channel/7-test-here/topic/Rajesh/near/2205534
r'\left. a \middle. b \right.',
Copy link
Member

Choose a reason for hiding this comment

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

Huh interesting — I didn't know you could use . that way in TeX 🙂

'<p>'
'<span class="katex-display"><span class="katex">'
'<span class="katex-mathml"><math xmlns="http://www.w3.org/1998/Math/MathML" display="block"><semantics><mrow><mi>a</mi><mo fence="true" lspace="0.05em" rspace="0.05em">.</mo><mi>b</mi></mrow><annotation encoding="application/x-tex">\\left. a \\middle. b \\right.</annotation></semantics></math></span>'
'<span class="katex-html" aria-hidden="true">'
'<span class="base">'
'<span class="strut" style="height:0.6944em;"></span>'
'<span class="minner">'
'<span class="mopen nulldelimiter"></span>'
'<span class="mord mathnormal">a</span>'
'<span class="nulldelimiter"></span>'
'<span class="mord mathnormal">b</span>'
'<span class="mclose nulldelimiter"></span></span></span></span></span></span></p>', [
KatexSpanNode(nodes: [
KatexStrutNode(heightEm: 0.6944, verticalAlignEm: null),
KatexSpanNode(nodes: [
KatexSpanNode(styles: KatexSpanStyles(widthEm: 0.12), nodes: []),
Copy link
Member

Choose a reason for hiding this comment

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

nit: simplify

Suggested change
KatexSpanNode(styles: KatexSpanStyles(widthEm: 0.12), nodes: []),
KatexSpanNode(styles: KatexSpanStyles(widthEm: 0.12)),

Copy link
Member Author

Choose a reason for hiding this comment

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

Hmm we need to specify an empty list here, because we currently require either text or nodes to be non-null in KatexSpanNode.

Copy link
Member

Choose a reason for hiding this comment

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

Ah I see, indeed. OK.

KatexSpanNode(
styles: KatexSpanStyles(fontFamily: 'KaTeX_Math', fontStyle: KatexSpanFontStyle.italic),
text: 'a'),
KatexSpanNode(styles: KatexSpanStyles(widthEm: 0.12), nodes: []),
KatexSpanNode(
styles: KatexSpanStyles(fontFamily: 'KaTeX_Math', fontStyle: KatexSpanFontStyle.italic),
text: 'b'),
KatexSpanNode(styles: KatexSpanStyles(widthEm: 0.12), nodes: []),
]),
]),
]);
}

void main() async {
Expand All @@ -663,6 +695,7 @@ void main() async {
testParseExample(KatexExample.textColor);
testParseExample(KatexExample.customColorMacro);
testParseExample(KatexExample.phantom);
testParseExample(KatexExample.nulldelimiter);

group('parseCssHexColor', () {
const testCases = [
Expand Down
4 changes: 4 additions & 0 deletions test/widgets/katex_test.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,10 @@ void main() {
('X', Offset(0.00, 7.04), Size(17.03, 25.00)),
('n', Offset(17.03, 15.90), Size(8.63, 17.00)),
]),
(KatexExample.nulldelimiter, skip: false, [
('a', Offset(2.47, 3.36), Size(10.88, 25.00)),
('b', Offset(15.81, 3.36), Size(8.82, 25.00)),
]),
];

for (final testCase in testCases) {
Expand Down