Allow code-input to wrap lines

[WebCoder49]

There should be an easy way to do this. white-space: pre-wrap doesn't seem to work.

[ukusormus]

From a project I'm working on, no wrap neither horizontally nor vertically and growing/shrinking with size
(the horizontal wrap part is /* always wrap content */):

using code-input 2.3:

<script src="https://cdn.jsdelivr.net/gh/WebCoder49/code-input@2.3/code-input.min.js"></script>
<link
 rel="stylesheet"
 href="https://cdn.jsdelivr.net/gh/WebCoder49/code-input@2.3/code-input.min.css"
/>

style fixes:

code-input {
 border: 1px solid black;
 margin: 0;

 /* grow with content */
 height: min-content;
}

code-input textarea,
code-input pre {
 /* always wrap content */
 white-space: pre-wrap;
 word-break: break-all;
 max-width: min-content;

 /* override JS fixating the height with inline style and causing the textarea not to shrink
 after deleting content */
 height: min-content !important;

 /* fixes the "CSS reset" directive `* { box-sizing: border-box }` causing cursor to jump around */
 box-sizing: content-box;
}

// edit: cool plugin btw!

[WebCoder49]

@ukusormus Thank you very much for this! When I have time, I'll add this to the documentation.

[ivanperez-keera]

This doesn't work for me. The cursor is in the next line, but the visible content scrolls right.

[WebCoder49]

Even if it did work on Feb 9, ukusormus' solution won't work with major version 3; the equivalent functionality would be good to add as a plugin in v3.0.0

[WebCoder49]

The Autocomplete plugin will need to be slightly adjusted to support this, by inserting all of the rest of the contents into the span element in the invisible pre. See here.