fix(code-block): normalize indentation of template literal snippets#217
Open
x0rgus wants to merge 3 commits intomintlify:mainfrom
Open
fix(code-block): normalize indentation of template literal snippets#217x0rgus wants to merge 3 commits intomintlify:mainfrom
x0rgus wants to merge 3 commits intomintlify:mainfrom
Conversation
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.

Problem
When passing code to
<CodeBlock>using JSX template literals, indentation from the surrounding JSX formatting is preserved.Example:
Because the snippet is indented inside JSX, the rendered output contains extra leading spaces on each line. This leads to inconsistent indentation and formatting issues in rendered code blocks.
This behavior was reported in the discussion:
https://github.com/orgs/mintlify/discussions/2374
Solution
This PR introduces a small
dedentutility that:The normalization happens before the code is passed to
BaseCodeBlock.Additionally, indentation detection now considers spaces only to avoid edge cases with mixed tab/space indentation.
Result
Code snippets written with indentation inside JSX template literals render correctly while preserving relative indentation.
Example:
Now renders as:
Testing
Tested via Storybook examples with:
Happy to adjust the approach if there's a preferred utility or existing helper for this.
Note
Low Risk
Low risk UI formatting change that normalizes whitespace before rendering/copying code; main risk is subtle behavior changes for snippets that intentionally rely on leading spaces.
Overview
Normalizes indentation for code passed as JSX template literals.
CodeBlocknow runs extractedchildrentext through a newdedentutility to trim leading/trailing blank lines and remove the minimum shared space indent before rendering and copying.Adds Storybook coverage with new
TemplateLiteral*stories (bash/yaml/js and empty-line cases) to demonstrate the updated rendering behavior.Written by Cursor Bugbot for commit e76c01b. This will update automatically on new commits. Configure here.