React: adding a tag with uncontrolled component

[cosydney]

Prerequisites

• [x] I am running the latest version
• [x] I checked the documentation and found no answer
• [x] I checked to make sure that this issue has not already been filed

Demo Page

React issue template: https://codesandbox.io/s/tagify-react-issue-template-forked-xr93km?file=/src/index.js

Hey,

Great package.

I'm looking for a way to have external buttons that adds tags in the input where the cursor is (if possible). Like on this screenshot:

Since I've noticed the Tagify package is not controlled I'm having a hard time having a simple solution.

Do you have any pointers on how to do that effectively? Here is a codesandbox of what I'd like to do: https://codesandbox.io/s/tagify-react-issue-template-forked-xr93km?file=/src/index.js

Thank you so much

[yairEO]

is it something like in this demo?

(Put your caret somewhere and then click the button)

[cosydney]

@yairEO are you missing the link, I don't see the demo?

[cosydney]

Like in this demo but mixed text and tags

[yairEO]

Hi sorry, here's the link: https://github.com/yairEO/tagify/issues/524#issuecomment-699140465

someone asked this a few years ago also

[yairEO]

Hi, are you still facing this issue or may I close this one?

[MateoKappa]

Hey im still having a hard time doing this with react hooks , i dont see anything with useRef either , am i missing something?

[yairEO]

I gave you the solution, what is the problem? why do you need to involve React hooks in this?

You only need to attach an onClick on the button and run the example code (shown in comment's link above)