TomSelect + StimulusReflex 3.5 (w/payload)

customer_reflex.rb

class CustomersReflex < ApplicationReflex
  def lookup(search)
    # use search string to do some kind of DB lookup here
    self.payload = {} # I have NO IDEA what tom-select expects!
    morph :nothing
  end
end

index.html

<select placeholder="Select a customer..." autocomplete="off" multiple data-controller="tom-select" data-tom-select-reflex-value="Customer#lookup">
</select>

tom_select_controller.js

import { Controller } from 'stimulus'
import TomSelect from 'tom-select'

export default class extends Controller {
  static values = {
    reflex: String,
    values: Array,
    options: String
  }

  connect() {
    this.control = new TomSelect(this.element, {
      plugins: ['remove_button'],
      valueField: 'value',
      labelField: 'text',
      searchField: [],
      preload: "focus",
      options: JSON.parse(this.optionsValue),
      items: this.valuesValue || [],
      load: this.search
    })
  }

  search = (search, callback) =>
    this.stimulate(this.reflexValue, search).then(({ payload }) =>
      callback(payload)
    )

  disconnect() {
    if (this.control) this.control.destroy()
  }
}