Prop to set class of list and list items

[nickbetsworth]

Problem description: I'm unable to apply a class to the <ul> and <li> when displaying suggestions. This is problematic in my case, as I have some style selectors which check for direct descendants (I can't get away with applying the style to the container). I've also got some pre-existing styles which I'd like to apply to the <li>.

Suggested solution: Add an equivalent component-attr-class-autosuggest-results-container for the list and list items.

[darrenjennings]

@nickbetsworth sounds like a good improvement. I had wanted to make the <ul> and <li> items composable, something like:

<vue-autosuggest v-slot="{listProps, listItemProps}">
  <input />
  <ul v-bind="listProps">
    <li v-bind="listItemProps" />
  </ul>
</vue-autosuggest>

but it turned out to not be easy since vue-autosuggest controls a good portion of the internals and would need a bigger rewrite. For now, I would probably want to add instead a listAttributes and listItemAttributes props, so that you could add more than simply class. For instance, you might want to to add arbitrary data-attr or otherwise.

[CalvinRodo]

Agreed I'm looking at integrating this into some work and we are using tailwindcss and just the way things work we can't use component styles so this would be a very nice addition.

[darrenjennings]

Fixed in vue-autosuggest@2.0.4-beta.0. Will be in v2.1.0 eventually but want to test out some things before bumping minor version.