open-index/open-npm huggingface dataset:
npm package: @filterbox/debugger
Description: This library was generated with [Nx](https://nx.dev).
Latest version: 1.0.2

# debugger

This library was generated with [Nx](https://nx.dev).

## Building

Run `nx build debugger` to build the library.

## Running unit tests

Run `nx test debugger` to execute the unit tests via [Vitest](https://vitest.dev/).
npm package: @filterbox/public_api
Description: Easily add dynamic filters to your next web project.
Latest version: 1.0.0

# Filterbox
Easily add dynamic filters to your next web project.

![](logo.svg)

## Install
```sh
npm install filterbox --save 
```

## How to use

```ts
import { Filterbox } from "filterbox";

// Create new instance
const filterbox = new Filterbox([{
    // unique filter key
    key: 'status',
    // filter control options
    control: {
        // use it to mach against a ui component
        type: 'select',
        // default value when no option is selected
        label: 'select status',
        // select options and their corresponding values
        options: [
            { label: 'Pending', value: 0 },
            { label: 'Completed', value: 1 },
        ],
    },
}]);

// Implement match strategy
class MatchStatus implements MatchStrategy<number> {
  constructor(private status: FilterValue) {}
  match(status: number): boolean {
    // will match all if nothing is selected
    if (this.status.isNotSet()) return true;
    // match status
    return status === this.status.intoInt();
  }
}

// Subscribe to changes
filterbox.subscribe((update) => {
    // read for filter value
    const value = update.getFilter('status').value();
    console.log(`Status filter change`);

    // create new match object for updated status
    filterbox.setMatch('status', new MatchStatus(value));

    // additionally setState in React
    // setState(update);
});

// set filter value
filterbox.getFilter('status').setValue(1); // 1 : Completed

// match data
filterbox.match([0,1]); // [1]

// generate query string
const q = "?" + filterbox.queryString(); // '?status=1'

// generate request payload
filterbox.requestPayload(); // { status: '1' }
```

*✏️ check examples folder for more*

📬 <a href="mailto:solomancode@gmail.com">solomancode@gmail.com</a>