[React] How to render dropdown in mixed mode

yairEO / tagify

🔖 lightweight, efficient Tags input component in Vanilla JS / React / Angular / Vue

https://yaireo.github.io/tagify/

Other

3.49k stars 431 forks source link

[React] How to render dropdown in mixed mode #1010

Open cosydney opened 2 years ago

cosydney commented 2 years ago

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 - clone one of the below:

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

Hey, I'd like to have the dropdown to be shown at all times in mixed mode using react. Any ideas how to do that?

yairEO commented 2 years ago

You want it as a dropdown or like this example:

https://yaireo.github.io/tagify/#section-manual-suggestions

I think currently it's not possible to render a manual dropdown in React, but I will put it on my list to support it

cosydney commented 2 years ago

Like in this example would be great

jremen commented 1 year ago

Any news regarding dropdown in manual mode using React? I have a design in a project that requires to use shadows and had it to be merged with search input so it looks like one panel. With dropdown in body I can’t do that. using Tagify pure javascript version I wasn’t successful to use it via Ref on input either (which is preferable to queryselector).

yairEO commented 1 year ago

@jremen - Actually I forgot about this ticket.

Regarding where the dropdown element node is appended to, it doesn't have to be the <body> element and can be configured using the dropdown.appendTarget setting

Can you post here the design? I'm interested what people use Tagify for.