Sha256: b88d1747e5222e3c560ef444bcfbf29ccd574708f16f3494575d55ec94b01e47

Contents?: true

Size: 1.31 KB

Versions: 1748

Compression:

Stored size: 1.31 KB

Contents

<%= pb_rails("typeahead", props: {
  async: true,
  get_option_label: 'getOptionLabel',
  get_option_value: 'getOptionValue',
  load_options: 'asyncPillsPromiseOptions',
  label: "Github Users",
  name: :foo,
  pills: true,
  placeholder: "type the name of a Github user"
}) %>

<!-- This section is an example of how to provide load_options prop for using dynamic options -->
<%= javascript_tag defer: "defer" do %>
  // Simple filter function, providing a list of results in the expected data format

  const filterResults = function(results) {
    return results.items.map(function(result) {
      return {
        name: result.login,
        id: result.id,
      }
    })
  }

  /* Note: Make sure you assign this to window or a namespace within window
  or it will not be accessible to the kit! */

  window.asyncPillsPromiseOptions = function(inputValue) {
    return new Promise(function(resolve) {
      if (inputValue) {
        fetch(`https://api.github.com/search/users?q=${inputValue}`)
          .then(function(response) { return response.json() })
          .then(function(results) { resolve(filterResults(results))})
      } else {
        resolve([])
      }
    })
  }

  window.getOptionLabel = function(option) {
    return option.name;
  }
  window.getOptionValue = function(option) {
    return option.id;
  }
<% end %>

Version data entries

1,748 entries across 1,748 versions & 2 rubygems

Version Path
playbook_ui_docs-14.9.0.pre.rc.9 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.9.0.pre.rc.9 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.8.0.pre.alpha.PLAY1680newwidthprop4661 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.8.0.pre.alpha.PLAY1680newwidthprop4661 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.8.0.pre.alpha.PLAY1658tanstackbump4657 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.8.0.pre.alpha.PLAY1658tanstackbump4657 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.8.0.pre.alpha.PLAY1649rolloutheightglobalprops4635 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.8.0.pre.alpha.PLAY1649rolloutheightglobalprops4635 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.9.0.pre.rc.8 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.9.0.pre.rc.8 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.8.0.pre.alpha.PLAY1598floatinguiupgrade4617 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.8.0.pre.alpha.PLAY1598floatinguiupgrade4617 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.9.0.pre.rc.7 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.9.0.pre.rc.7 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.9.0.pre.rc.6 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.9.0.pre.rc.6 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.9.0.pre.rc.5 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.9.0.pre.rc.5 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui_docs-14.8.0.pre.alpha.pbntr661createstickyleftprop4612 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb
playbook_ui-14.8.0.pre.alpha.pbntr661createstickyleftprop4612 app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.html.erb