delowardev / vue3-emoji-picker

Simple and Powerful Emoji Picker for Vue3
https://codesandbox.io/p/github/delowardev/vue3-emoji-picker/main?file=%2FREADME.md
MIT License
171 stars 34 forks source link

[Question] Some way to work the textarea mode in a friendly way #54

Open xcesaralejandro opened 1 year ago

xcesaralejandro commented 1 year ago

The component renders the textarea in a nested manner when defined as pickerType="'textarea'", so my tags don't apply directly to the textarea (as I would expect) and not being able to link it directly as a model is quite tedious since The only way I can think of to access the rendered textarea is through references.

If, for example, I want to define a placeholder or preload an initial text in my textarea, it becomes unfriendly.

What would be the correct way to initialize my textarea with a text?

delowardev commented 1 year ago

Hi @xcesaralejandro Did you try the :text="" prop? It will render initial text to the textarea/input field. I see it's not mentioned in the doc, I will update it. Thanks

xcesaralejandro commented 1 year ago

Yes, the :text="" property has been useful for me. It would be interesting to have :placeholder="" and, since there is no deceit in asking (I am very short of time to send a PR) it would be interesting to have a property :auto-height="true" and thus avoid having to create a reference.

The auto-height would be that the input grows in relation to the text it contains (reference):

if(textarea.value != null){
    textarea.value.style.height = 'auto';
    textarea.value.style.height = textarea.value.scrollHeight + 'px';
  }

If your beautiful package already does that, what would the properties be?