String text passed in as a value in <textarea> does not seem to be supported with react-linkify

[BrianHHough]

Hi Linkify! LOVE your SDK by the way 🔥

I'm trying to take in a text area and then identify handles or hashtags or links in the . I can do this 100% with Div's, strings, etc. but for some reason, Linkify won't recognize the actual text inside of the <textarea> to put links to it.</p> <p>Is there a way to use the {children} module of Linkify to then ID the text inside of a child component and then Linkify that?</p> <p>Any help understanding how to do this would be really appreciated!</p> <p>Thank you!</p> <p>My attempted code:</p> <pre><code class="language-javascript"> var text = "Hey there I'm a text posted by: @user1 \n #newPosterHere \n https://thisisawebsitethatshouldbelinked.com" <Linkify componentDecorator={textareaDecorator} matchDecorator={matchDecoratorTextArea} > <textarea id="textarea" fontSize="15px" lineHeight="25px" readOnly name="textarea" value={text} style={{ width: "400px", height: "100px" }} > </textarea> </Linkify></code></pre> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/fvsch"><img src="https://avatars.githubusercontent.com/u/243601?v=4" />fvsch</a> commented <strong> 2 years ago</strong> </div> <div class="markdown-body"> <p>Textareas only work with plain text.</p> <p>You need a fully-fledged editor like ProseMirror if you want to do rich text formatting like making links clickable, injecting avatars, etc.</p> <p>If you only plan to render text in a non-editable way, I suggest using another element (e.g. a DIV) instead of <code><textarea readOnly></code>.</p> </div> </div> <div class="page-bar-simple"> </div> <div class="footer"> <ul class="body"> <li>© <script> document.write(new Date().getFullYear()) </script> Githubissues.</li> <li>Githubissues is a development platform for aggregating issues.</li> </ul> </div> <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script> <script src="/githubissues/assets/js.js"></script> <script src="/githubissues/assets/markdown.js"></script> <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/highlight.min.js"></script> <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/languages/go.min.js"></script> <script> hljs.highlightAll(); </script> </body> </html>