npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

hire-faceted-search

v7.0.1

Published

Downloads

16

Readme

Hire Faceted Search

build status

A faceted search React component.

Config for publications

import FacetedSearch from "hire-faceted-search";

// Basic search configuration
let searchConfig = {
    // Base URL
    baseURL: "http://(...)/v2",
    // API path
    searchPath: "search/path",
    // Provide a VRE ID for headers
    headers: {VRE_ID: "VreId"}
};

// Labels for human presentation of metadata labels (key = facets[n].name and refs[n].data[key])
let labels = {
	facetTitles: {
		"dynamic_s_creator": "Author",
		...
	}
};

// Controlled list of facet filters (default = all)
let facetList = ["dynamic_s_creator", ...];

// Metadata fields to be presented with result (default = all)
let metadataList = ["createdBy", ...];


React.render(<FacetedSearch
	config={searchConfig}
	facetList={facetList}
	labels={labels}
	metadataList={metadataList}
	onChange={function(data) {console.log(data)}}
	onSelect={this.gotodoc.bind(this)}
	 />, document.body);

Props

className              Add a custom className to root el.

config                 Map of config options.

customComponents       Map of custom components. Currently supported:
                       currentQuery, filters and result.

facetList              List of facet names. Determines order.

facetSortMap           Map of sort types. Keys are facet names,
                       values are maps with a `direction` and `type` key.

labels                 Map of labels. Used when the server doesn't
                       return a title for a facet. Or for i18n.

metadataList           List of metadata to be shown per result.

numberedResults        Boolean. Show <ol> or <ul> result list.

onChange               Function. Called when a new search result
                       is received. Returns the search results.

onSearchId             Function. Called when a new search result
                       is received. Returns the search ID.

onSelect               Function. Called when user click or touches
                       (selects) a search result.

query                  Map of query parameters. Usually the query
                       parameters are internal. In case of a forced
                       rerender or when passing queries from one
                       search to the other, passing a query via
                       props becomes necessary.

Config

baseURL                Base of the search URL.

fullTextSearchFields   List of full text search fields. Consists
                       of maps with name and position key.

headers                Map of custom headers.

hideFreeTextSearch     Boolean to show/hide full text search.

queryDefaults          Map of search query defaults.

rows                   Number of rows per result list.

searchPath             Path of the search URL.