vs actions as (scoped) slots

Howdy, thanks for the time and effort to make this :) I (gladly) heard about the renderless mode planned for v3 💥 but while that doesn't come out, what do you think about passing elements to actions (clear and toggle icon) as slots?

At the moment we rely on .clear selector (with high specificity) to style the button and on css trickery to "design" the Chevron toggle. At some cases would be nice to pass custom elements/components such as buttons or icons (svg). I've did some playing at my fork and this might be simple to implement.

Let me know if still interesting for the current release, it would look something like this:

 <v-select placeholder="default" :options="options" :showClearButton="true">
   <MyButton
    slot="clear-button"
    slot-scope="{showClearButton, clearSelection}"
    @click="clearSelection"
    v-if="showClearButton"
  >clear</MyButton>

 <MyOwnChevronSvgIcon slot="open-indicator" data-vs-toggle />
</v-select>

Note the data-vs-toggle selector, since (as far as i my vue knowledge goes) we can't pass refs through slot scope.

<!-- source -->
...
<div class="vs__actions">
  <slot
    name="clear-button"
    :showClearButton="showClearButton"
    :clearSelection="clearSelection"
    :disabled="disabled"
  >
    <button
      v-show="showClearButton"
      :disabled="disabled"
      @click="clearSelection"
      type="button"
      class="clear"
      title="Clear selection"
    >
      <span aria-hidden="true">&times;</span>
    </button>
  </slot>

  <span
    v-if="!noDrop"
    ref="openIndicator"
    role="presentation"
    :class="{'open-indicator': !$slots['open-indicator'] || $slots['open-indicator'] === ''}"
  >
    <slot name="open-indicator" />
  </span>
</div>
 ...
/**
* Toggle the visibility of the dropdown menu.
* @param  {Event} e
* @return {void}
*/
toggleDropdown(e) {
  if (... || e.target.hasAttribute("data-vs-toggle") {

sagalbot / vue-select

vs actions as (scoped) slots #685