Code block invisible line numbers fixed, QuillEditorConfig.showCodeBlockLineNumbers added

CHANGELOG.md

@@ -13,6 +13,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 - Added localization support for `mn` (Mongolian, Mongolia)
+- Added `QuillEditorConfig.showCodeBlockLineNumbers` (defaults to `true`). When set to `false`, code-block line numbers are hidden and the left gutter shrinks to match the code block's right indent, giving the block symmetric horizontal padding instead of a flush-left edge. `customLeadingBlockBuilder` remains available for finer control and still takes precedence when both are set.
+
+### Fixed
+
+- Code block line numbers were not visible for non-indented code blocks because the leading-gutter width was reserved at zero pixels in `TextBlockUtils.defaultIndentWidthBuilder`. The gutter is now sized correctly so line numbers are visible by default. Nested indent levels continue to rotate the numbering style through Arabic, lowercase letters, and lowercase Roman numerals, matching ordered-list behavior.
+
+### Changed
+
+- 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.
 
 ## [11.5.0] - 2025-10-18
 

lib/src/editor/config/editor_config.dart

@@ -86,11 +86,20 @@ class QuillEditorConfig {
     this.readOnlyMouseCursor = SystemMouseCursors.text,
     this.onPerformAction,
     @experimental this.customLeadingBlockBuilder,
+    this.showCodeBlockLineNumbers = true,
   });
 
   @experimental
   final LeadingBlockNodeBuilder? customLeadingBlockBuilder;
 
+  /// Whether to display line numbers in code blocks.
+  ///
+  /// Defaults to `true`. When `false`, the line-number widget is hidden
+  /// and the left gutter shrinks to match the code block's right indent
+  /// (`fontSize / 2` by default), so the block has symmetric horizontal
+  /// padding instead of a flush-left edge.
+  final bool showCodeBlockLineNumbers;
+
   /// The text placeholder in the quill editor
   final String? placeholder;
 
@@ -531,10 +540,13 @@ class QuillEditorConfig {
     void Function()? onScribbleActivated,
     EdgeInsets? scribbleAreaInsets,
     void Function(TextInputAction action)? onPerformAction,
+    bool? showCodeBlockLineNumbers,
   }) {
     return QuillEditorConfig(
       customLeadingBlockBuilder:
           customLeadingBlockBuilder ?? this.customLeadingBlockBuilder,
+      showCodeBlockLineNumbers:
+          showCodeBlockLineNumbers ?? this.showCodeBlockLineNumbers,
       placeholder: placeholder ?? this.placeholder,
       characterShortcutEvents:
           characterShortcutEvents ?? this.characterShortcutEvents,

lib/src/editor/editor.dart

@@ -269,6 +269,7 @@ class QuillEditorState extends State<QuillEditor>
         spaceShortcutEvents: widget.config.spaceShortcutEvents,
         onKeyPressed: widget.config.onKeyPressed,
         customLeadingBuilder: widget.config.customLeadingBlockBuilder,
+        showCodeBlockLineNumbers: widget.config.showCodeBlockLineNumbers,
         focusNode: widget.focusNode,
         scrollController: widget.scrollController,
         scrollable: config.scrollable,

lib/src/editor/raw_editor/config/raw_editor_config.dart

@@ -72,6 +72,7 @@ class QuillRawEditorConfig {
     this.onPerformAction,
     @experimental this.customLeadingBuilder,
     this.quillMagnifierBuilder,
+    this.showCodeBlockLineNumbers = true,
   });
 
   /// Controls whether this editor has keyboard focus.
@@ -82,6 +83,9 @@ class QuillRawEditorConfig {
   @experimental
   final LeadingBlockNodeBuilder? customLeadingBuilder;
 
+  /// See [QuillEditorConfig.showCodeBlockLineNumbers].
+  final bool showCodeBlockLineNumbers;
+
   /// Contains all the events that will be handled when
   /// the exact characters satifies the condition. This mean
   /// if you press asterisk key, if you have a `CharacterShortcutEvent` with

lib/src/editor/raw_editor/raw_editor_state.dart

@@ -595,6 +595,7 @@ class QuillRawEditorState extends EditorState
           block: node,
           controller: controller,
           customLeadingBlockBuilder: widget.config.customLeadingBuilder,
+          showCodeBlockLineNumbers: widget.config.showCodeBlockLineNumbers,
           textDirection: nodeTextDirection,
           scrollBottomInset: widget.config.scrollBottomInset,
           horizontalSpacing: _getHorizontalSpacingForBlock(node, _styles),
@@ -605,7 +606,7 @@ class QuillRawEditorState extends EditorState
           enableInteractiveSelection: widget.config.enableInteractiveSelection,
           hasFocus: _hasFocus,
           contentPadding: attrs.containsKey(Attribute.codeBlock.key)
-              ? const EdgeInsets.all(16)
+              ? const EdgeInsets.symmetric(horizontal: 4, vertical: 16)
               : null,
           embedBuilder: widget.config.embedBuilder,
           textSpanBuilder: widget.config.textSpanBuilder,

lib/src/editor/widgets/text/text_block.dart

@@ -84,6 +84,7 @@ class EditableTextBlock extends StatelessWidget {
     this.customStyleBuilder,
     this.customLinkPrefixes = const <String>[],
     this.customLeadingBlockBuilder,
+    this.showCodeBlockLineNumbers = true,
     super.key,
   });
 
@@ -97,6 +98,7 @@ class EditableTextBlock extends StatelessWidget {
   final Color color;
   final DefaultStyles? styles;
   final LeadingBlockNodeBuilder? customLeadingBlockBuilder;
+  final bool showCodeBlockLineNumbers;
   final bool enableInteractiveSelection;
   final bool hasFocus;
   final EdgeInsets? contentPadding;
@@ -168,6 +170,17 @@ class EditableTextBlock extends StatelessWidget {
         TextBlockUtils.defaultIndentWidthBuilder;
 
     final count = block.children.length;
+    final isCodeBlock =
+        block.style.attributes.containsKey(Attribute.codeBlock.key);
+    final blockSpacing =
+        indentWidthBuilder(block, context, count, numberPointWidthBuilder);
+    final HorizontalSpacing horizontalSpacingForBlock;
+    if (isCodeBlock && !showCodeBlockLineNumbers) {
+      horizontalSpacingForBlock =
+          HorizontalSpacing(blockSpacing.right, blockSpacing.right);
+    } else {
+      horizontalSpacingForBlock = blockSpacing;
+    }
     final children = <Widget>[];
     if (clearIndents) {
       indentLevelCounts.clear();
@@ -199,7 +212,7 @@ class EditableTextBlock extends StatelessWidget {
             customRecognizerBuilder: customRecognizerBuilder,
             composingRange: composingRange,
           ),
-          indentWidthBuilder(block, context, count, numberPointWidthBuilder),
+          horizontalSpacingForBlock,
           _getSpacingForLine(line, index, count, defaultStyles),
           textDirection,
           textSelection,
@@ -297,21 +310,21 @@ class EditableTextBlock extends StatelessWidget {
         );
       }(),
       width: () {
-        if (isOrdered || isCodeBlock) {
+        if (isOrdered) {
           return numberPointWidthBuilder(fontSize, count);
         }
+        if (isCodeBlock) {
+          return numberPointWidthBuilder(fontSize, count) - fontSize / 4;
+        }
         if (isUnordered) {
           return numberPointWidthBuilder(fontSize, 1); // same as fontSize * 2
         }
         return null;
       }(),
       padding: () {
-        if (isOrdered || isUnordered) {
+        if (isOrdered || isUnordered || isCodeBlock) {
           return fontSize / 2;
         }
-        if (isCodeBlock) {
-          return fontSize;
-        }
         return null;
       }(),
       lineSize: isCheck ? fontSize : null,
@@ -343,6 +356,7 @@ class EditableTextBlock extends StatelessWidget {
       return checkboxLeading(leadingConfig);
     }
     if (isCodeBlock) {
+      if (!showCodeBlockLineNumbers) return null;
       return codeBlockLineNumberLeading(leadingConfig);
     }
     return null;

lib/src/editor/widgets/text/utils/text_block_utils.dart

@@ -68,9 +68,10 @@ abstract final class TextBlockUtils {
       baseIndent = fontSize * 2;
       if (attrs[Attribute.list.key] == Attribute.ol) {
         baseIndent = numberPointWidthBuilder(fontSize, count);
-      } else if (attrs.containsKey(Attribute.codeBlock.key)) {
-        baseIndent = numberPointWidthBuilder(fontSize, count);
       }
+    } else if (attrs.containsKey(Attribute.codeBlock.key)) {
+      baseIndent = numberPointWidthBuilder(fontSize, count) - fontSize / 4;
+      return HorizontalSpacing(baseIndent + extraIndent, fontSize / 2);
     }
 
     return HorizontalSpacing(baseIndent + extraIndent, 0);