Isomorphic Search

A configurable, extensible search interface written in ES6.

Fuse is the default search engine, but any search engine can be used if passed via the options object as engine.

jQuery is an external dependency, though that will change soon enough.

Load Search in Browser
To use the script tag, reference the built script:

<script src="/node_modules/isomorphic-search/build/search.min.js"></script>

There's also a UMD build accessible through build/search.js.

To build your own, you may benefit from reviewing .babelrc and/or webpack.config.js, along with the obvious, package.json.

Example

const data = [{id: 1, name: 'One'}, {id: 2, name: 'Two'}];

// Only the `options.engine` property must absolutely be set.
// See src/agent/abstraction for defaults.
const options: {
  // Any search engine will do.  See `control.engine`.
  engine: Fuse,
  // A selector identifying the element to contain the search module form.
  parent: 'header',
  // These are the options passed to the search engine: (data, options) => {}
  options: {
    keys: [{ name: 'id', weight: .3 }, { name: 'name', weight: .7 }],
    threshold: .2
  },
  // Set callbacks on the search input field in response to the below events.
  metadata: {
    input: {
      // Set input's placeholder text.
      placeholder: 'Search',
      // Set callback on click of cancel icon.
      cancel: {
        callback: function(el, search) { }
      },
      // Set callback in response to input's focus event.
      focus: {
        callback: function(el, search) { }
      },
      // Set callback in response to input's change event.
      change: {
        callback: function(el, search) { }
      },
    },
    result: {
      // Data is the `dataset` on the clicked element.
      callback: function(data) {}
    },
    results: {
      // Set a class on the results ul.
      className: 'toggled-element',
      // Add instructions above the results element.
      instructions: 'Search to filter the results below.'
    },
  }
};

// Sets abstraction on control, configures search engine, & sets form on view.
Search.constructor(data, options);

Contribute

npm run build

@TODO

[x] Browser-facing
[ ] Server-facing