uiwjs / uiwjs/react-codemirror
Problem with autoresize and min height
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 2.3k
- Forks
- 161
- PR merge metrics
- No merged PRs in 30d
Description
I want to use react-codemirror in an editor that auto-resizes, but I still want to use a minimum height. Unfortunately, react-codemirror does set height: '100% !important' on the .cm-scroller element. That way, I always end up with something like this when only adding a minHeight and maxHeight:
<CodeMirror minHeight="200px" maxHeight="75vh" theme="dark" value={optionsSource} />
I would like to have the horizontal scrollbar at the bottom of the editor, but still want it to grow until a given height.
Is there a good workaround for having an auto-resizing editor that also has a minimum height? Or can I turn off the height: '100% !important' somehow?
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by inspecting the CodeMirror component's handling of the minHeight and maxHeight props and the .cm-scroller styling described in the issue. Reproduce the provided configuration, then verify that the editor keeps its minimum height, grows to the maximum height, and retains the horizontal scrollbar at the bottom.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 28/100