Skip to content

Code block invisible line numbers fixed, QuillEditorConfig.showCodeBlockLineNumbers added - #2733

Open
Alspb wants to merge 2 commits into
singerdmx:masterfrom
Alspb:fix/code-block-invisible-line-numbers
Open

Code block invisible line numbers fixed, QuillEditorConfig.showCodeBlockLineNumbers added#2733
Alspb wants to merge 2 commits into
singerdmx:masterfrom
Alspb:fix/code-block-invisible-line-numbers

Conversation

@Alspb

@Alspb Alspb commented May 20, 2026

Copy link
Copy Markdown
Collaborator

Description

fix: make code block line numbers visible

Code-block line numbers were invisible for non-indented code blocks.
Nested indent levels keep rotating the numbering style (Arabic → letters →
Roman), matching ordered-list behavior.

feat: add QuillEditorConfig.showCodeBlockLineNumbers

Adds QuillEditorConfig.showCodeBlockLineNumbers (default true which doesn't change the current behavior) — a focused opt-out that replaces the v10 QuillEditorCodeBlockElementOptions.enableLineNumbers removed in v11.

Rationale:

  1. customLeadingBlockBuilder could already hide the line-number widget (SizedBox.shrink()), but leaves a wide blank left gutter.
  2. Unlike ordered lists, line numbers in code blocks aren't a universal convention — Markdown, for instance, doesn't render them at all. A dedicated toggle to show or hide them is therefore worth having.

Type of Change

  • Feature: New functionality without breaking existing features.
  • 🛠️ Bug fix: Resolves an issue without altering current behavior.
  • 🧹 Refactor: Code reorganization, no behavior change.
  • Breaking: Alters existing functionality and requires updates.
  • 🧪 Tests: New or modified tests
  • 📝 Documentation: Updates or additions to documentation.
  • 🗑️ Chore: Routine tasks, or maintenance.
  • Build configuration change: Build/configuration changes.

Copilot AI review requested due to automatic review settings May 20, 2026 18:09

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Pull request overview

This PR fixes code-block line numbers not being visible in non-indented code blocks by reserving non-zero leading gutter width, and introduces a new QuillEditorConfig.showCodeBlockLineNumbers toggle (default true) to allow hiding code-block line numbers while shrinking the gutter.

Changes:

  • Fix code-block gutter sizing so line numbers render visibly by default, and refine code-block gutter/padding dimensions.
  • Add QuillEditorConfig.showCodeBlockLineNumbers and plumb it through QuillEditorQuillRawEditorEditableTextBlock.
  • Update changelog entries describing the new option and the layout adjustments.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
lib/src/editor/widgets/text/utils/text_block_utils.dart Fix default indent width calculation for code blocks; add right indent for code blocks.
lib/src/editor/widgets/text/text_block.dart Add showCodeBlockLineNumbers handling; adjust code-block leading width/padding and optionally hide line-number leading.
lib/src/editor/raw_editor/raw_editor_state.dart Pass through showCodeBlockLineNumbers; adjust code-block contentPadding.
lib/src/editor/raw_editor/config/raw_editor_config.dart Add showCodeBlockLineNumbers to raw editor config.
lib/src/editor/editor.dart Forward showCodeBlockLineNumbers from QuillEditorConfig into QuillRawEditorConfig.
lib/src/editor/config/editor_config.dart Add showCodeBlockLineNumbers property + docs + copyWith support.
CHANGELOG.md Document the new toggle and the code-block gutter/padding behavior changes.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines +176 to +180
indentWidthBuilder(block, context, count, numberPointWidthBuilder);
final HorizontalSpacing horizontalSpacingForBlock;
if (isCodeBlock && !showCodeBlockLineNumbers) {
horizontalSpacingForBlock =
HorizontalSpacing(blockSpacing.right, blockSpacing.right);
Comment thread CHANGELOG.md
- Tightened the code-block leading gutter: its reserved width is now slightly narrower than the ordered-list gutter (by `fontSize / 4`), pulling the right-aligned line number closer to the left edge of the block.
- Reduced the right-side padding inside the code-block leading container from `fontSize` to `fontSize / 2`, shrinking the gap between the line number and the code text to match ordered/unordered lists.
- Reduced the left content padding inside the code-block decoration from `16` to `4`, so the line number sits closer to the left edge of the grey code-block box.
- Made the code-block content padding symmetric (`EdgeInsets.symmetric(horizontal: 4, vertical: 16)`, previously `16` on the right), and added a `fontSize / 2` right indent to code blocks in `TextBlockUtils.defaultIndentWidthBuilder` so the code text no longer runs to the right edge of the box. The right indent is part of the default `indentWidthBuilder`, so a custom `indentWidthBuilder` can override it.
Comment on lines +72 to 75
} else if (attrs.containsKey(Attribute.codeBlock.key)) {
baseIndent = numberPointWidthBuilder(fontSize, count) - fontSize / 4;
return HorizontalSpacing(baseIndent + extraIndent, fontSize / 2);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants