Skip to content

fix: mirror explicit left/right paragraph alignment for rtl #3235

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

Open
artem-harbour wants to merge 1 commit into
base: main
Choose a base branch
from
Open

fix: mirror explicit left/right paragraph alignment for rtl #3235

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
6 changes: 3 additions & 3 deletions packages/layout-engine/pm-adapter/src/attributes/spacing-indent.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -114,9 +114,9 @@ describe('normalizeAlignment', () => {
expect(normalizeAlignment('end', true)).toBe('left');
});

it('does not flip explicit left/right/center/justify in RTL', () => {
expect(normalizeAlignment('left', true)).toBe('left');
expect(normalizeAlignment('right', true)).toBe('right');
it('maps explicit left/right to logical start/end in RTL', () => {
expect(normalizeAlignment('left', true)).toBe('right');
expect(normalizeAlignment('right', true)).toBe('left');
expect(normalizeAlignment('center', true)).toBe('center');
expect(normalizeAlignment('justify', true)).toBe('justify');
});
Expand Down
6 changes: 4 additions & 2 deletions packages/layout-engine/pm-adapter/src/attributes/spacing-indent.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,10 +43,12 @@ const AUTO_SPACING_LINE_DEFAULT = 240; // Default OOXML auto line spacing in twi
export const normalizeAlignment = (value: unknown, isRtl = false): ParagraphAttrs['alignment'] => {
switch (value) {
case 'center':
case 'right':
case 'justify':
case 'left':
return value;
case 'left':
return isRtl ? 'right' : 'left';
case 'right':
return isRtl ? 'left' : 'right';
Comment on lines +48 to +51
Copy link
Copy Markdown

@chatgpt-codex-connector chatgpt-codex-connector Bot May 11, 2026

Choose a reason for hiding this comment

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

P2 Badge Preserve visual align commands for RTL paragraphs

When an existing RTL paragraph is edited through the TextAlign extension, setTextAlign('left'/'right') stores the requested visual value directly in paragraphProperties.justification (packages/super-editor/src/editors/v1/extensions/text-align/text-align.js:46). On the next render this normalizer now mirrors that PM attr, so clicking Align Left on an RTL paragraph writes left but DomPainter receives right (and vice versa). This makes the editor toolbar/shortcuts inverted for RTL paragraphs unless the command layer is updated to store the mirrored OOXML value or this mirroring is limited to imported OOXML semantics.

Useful? React with 👍 / 👎.

case 'both':
case 'distribute':
case 'numTab':
Expand Down
33 changes: 32 additions & 1 deletion packages/layout-engine/pm-adapter/src/index.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4655,7 +4655,7 @@ describe('toFlowBlocks', () => {
});
});

it('preserves explicit left alignment on RTL paragraphs', () => {
it('maps explicit left alignment to right on RTL paragraphs', () => {
const pmDoc = {
type: 'doc',
content: [
Expand All @@ -4680,6 +4680,37 @@ describe('toFlowBlocks', () => {

const { blocks } = toFlowBlocks(pmDoc);

expect(blocks).toHaveLength(1);
expect(blocks[0].attrs?.direction).toBe('rtl');
expect(blocks[0].attrs).toMatchObject({
alignment: 'right',
});
});

it('maps explicit right alignment to left on RTL paragraphs', () => {
const pmDoc = {
type: 'doc',
content: [
{
type: 'paragraph',
attrs: {
paragraphProperties: {
rightToLeft: true,
justification: 'right',
},
},
content: [
{
type: 'text',
text: 'مرحبا بالعالم',
},
],
},
],
};

const { blocks } = toFlowBlocks(pmDoc);

expect(blocks).toHaveLength(1);
expect(blocks[0].attrs?.direction).toBe('rtl');
expect(blocks[0].attrs).toMatchObject({
Expand Down
Loading