davidl/tolaria
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: scope math block selection highlight

Browse Source
This commit is contained in:
lucaronin
2026-06-06 03:23:04 +02:00
parent 42d7a3ac44
commit 8fc366c8c0
2 changed files with 23 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/EditorTheme.css
View File

@@ -292,11 +292,20 @@
}
.editor__blocknote-container .math-block-shell {
width: 100%;
max-width: 100%;
overflow-x: auto;
padding: 6px 0;
}
.editor__blocknote-container .math-block-shell:not(.math-block-shell--editing) {
width: fit-content;
margin-inline: auto;
}
.editor__blocknote-container .math-block-shell--editing {
width: 100%;
}
.editor__blocknote-container .math-block-source::selection {
background: var(--colors-selection);
color: var(--colors-text);

13
src/components/editorSchema.math.test.tsx
View File

@@ -1,3 +1,4 @@
import { readFileSync } from 'node:fs'
import { fireEvent, render, screen } from '@testing-library/react'
import { describe, expect, it, vi } from 'vitest'
import { MathBlockEditor } from './editorSchema'
@@ -73,4 +74,16 @@ describe('MathBlockEditor', () => {
expect(source).not.toHaveClass('selection:text-primary-foreground')
expect(source).not.toHaveClass('focus-visible:ring-[3px]')
})
it('keeps display math selection chrome scoped to the rendered formula width', () => {
const editorThemeCss = readFileSync(`${process.cwd()}/src/components/EditorTheme.css`, 'utf8')
expect(editorThemeCss).toContain('.editor__blocknote-container .math-block-shell {')
expect(editorThemeCss).toContain('max-width: 100%;')
expect(editorThemeCss).toContain('.editor__blocknote-container .math-block-shell:not(.math-block-shell--editing) {')
expect(editorThemeCss).toContain('width: fit-content;')
expect(editorThemeCss).toContain('margin-inline: auto;')
expect(editorThemeCss).toContain('.editor__blocknote-container .math-block-shell--editing {')
expect(editorThemeCss).toContain('width: 100%;')
})
})