Gathering detailed insights and metrics for selectorator
Gathering detailed insights and metrics for selectorator
Gathering detailed insights and metrics for selectorator
Gathering detailed insights and metrics for selectorator
jquery-selectorator
jQuery plugin that returns simplest selector of elements.
@acemarke/redux-starter-kit
A simple set of tools to make using Redux easier
redux-easy-kit
A simple set of tools to make using Redux easier
jive-redux-starter-kit
A simple set of tools to make using Redux easier
npm install selectorator
Typescript
Module System
Node Version
NPM Version
93.6
Supply Chain
100
Quality
77.5
Maintenance
100
Vulnerability
99.6
License
Updated on 06 Oct 2024
Minified
Minified + Gzipped
TypeScript (90.18%)
JavaScript (9.82%)
Cumulative downloads
Total Downloads
Last day
-9.3%
Compared to previous day
Last week
-24.6%
Compared to previous week
Last month
16.9%
Compared to previous month
Last year
38.7%
Compared to previous year
4
selectorator
is an abstraction API for creating selectors via reselect with less boilerplate code.
$ npm i selectorator --save
Versions of selectorator
on or above 3.x.x
will use the corresponding major version of reselect
as a dependency. If you wish to still use the 2.x.x
branch of reselect
for your application, then you should continue using the 1.x.x
branch of selectorator
.
If you would like to learn more about the breaking changes related to the major version change for reselect
, please visit the reselect
CHANGELOG.
1import createSelector from "selectorator"; 2 3// selector created with single method call 4const getBarBaz = createSelector( 5 ["foo.bar", "baz"], 6 (bar, baz) => `${bar} ${baz}` 7); 8 9const state = { 10 foo: { bar: "bar" }, 11 baz: "baz" 12}; 13 14console.log(getBarBaz(state)); // "bar baz"
Not a whole lot of magic here, just simplifying the creation of the "identity selectors" that reselect
requires, instead replacing them with a standardized dot- or bracket-notation string for retrieval of a nested property in the state object.
That said, you can still use your own custom identity selectors, or compose selectors, if you so choose. Here is the example from the reselect
README modified to use selectorator
:
1// subtotal built using simple method 2const getSubtotal = createSelector( 3 ["shop.items"], 4 items => items.reduce((sum, { value }) => sum + value, 0) 5); 6 7// tax built with simple method combined with other selector 8const getTax = createSelector( 9 [getSubtotal, "shop.taxPercent"], 10 (subtotal, taxPercent) => subtotal * (taxPercent / 100) 11); 12 13// total build entirely with other selectors 14const getTotal = createSelector( 15 [getSubtotal, getTax], 16 (subtotal, tax) => ({ total: subtotal + tax }) 17); 18 19const state = { 20 shop: { 21 taxPercent: 8, 22 items: [{ name: "apple", value: 1.2 }, { name: "orange", value: 0.95 }] 23 } 24}; 25 26console.log("subtotal: ", getSubtotal(state)); // 2.15 27console.log("tax: ", getTax(state)); // 0.172 28console.log("total: ", getTotal(state)); // {total: 2.322}
The following types of shorthand are available for parameter selector creation:
string
=> 'foo[0].bar'
number
=> 0
Array
=> ['foo', 0, 'bar']
Object
=> {path: 'foo[0].bar', argIndex: 1}
Please note that the Object
usage is the only approach that will allow for selection of parameters. All other shorthands will pull from the first parameter.
Selectorator now supports two optional type parameters, it accepts an Input type param (usually the redux state) and the expected output type.
When creating a selector that accepts multiple params, the state should be array of the input types example
i.e createSelector<[State, number[], boolean], string>
1 import createSelector from "selectorator"; 2 3 interface State { 4 foo: { 5 bar: string; 6 }; 7 baz: string; 8 }; 9 // State is input type, string is output type 10 const getBarBaz = createSelector<State, string>( 11 ["foo.bar", "baz"], 12 (bar, baz) => `${bar} ${baz}` 13 ); 14 15 // getBarBaz() has type signature: (state: State) => string; 16 17 const getBarBaz2 = createSelector<any, string>( 18 ["foo.bar", "baz"], 19 (bar, baz) => `${bar} ${baz}` 20 ); 21 22 // getBarBaz2() has type signature: (state: any) => string; 23 24 const getBarBaz3 = createSelector( 25 ["foo.bar", "baz"], 26 (bar, baz) => `${bar} ${baz}` 27 ); 28 29 // getBarBaz3() has type signature: (state: any) => any; 30 31 const getBarBaz4 = createSelector( 32 ["foo.bar", "baz", { path: 0, argIndex: 2 }], 33 (bar, baz) => `${bar} ${baz}` 34 ); 35 36 // getBarBaz4() has type signature: (...state: any[]) => any; 37 38 const getBarBazQux5 = createSelector<[State, string[]], string>( 39 ["foo.bar", "baz", { path: 0, argIndex: 2 }], 40 (bar, baz) => `${bar} ${baz}` 41 ); 42 43 // getBarBaz5() has type signature: (state_0: State, state_1: string[]) => string; 44 45 const getStucturedBarBaz = createSelector({ barBaz: getBarBaz }); 46 47 // getStructuredBarBaz() has type signature: (state: any) => ({ barBaz: string });
All the capabilities that exist with reselect
are still available using selectorator
, they are just passed as an object of options to createSelector
.
defaults to false
A common usage of custom selectors is to perform a deep equality check instead of the standard strict equality check when comparing values. To apply this, simply set deepEqual
to true
.
1import createSelector from "selectorator"; 2 3const selectoratorOptions = { deepEqual: true }; 4 5const getBaz = createSelector( 6 ["foo.bar.baz"], 7 baz => !!baz, 8 selectoratorOptions 9);
defaults to isSameValueZero
If you want to use a custom equality comparator, pass the method as this option.
1import createSelector from "selectorator"; 2 3const selectoratorOptions = { 4 // silly example checking current or next values related to "foo" 5 isEqual(currentFoo, nextFoo) { 6 return currentFoo === "foo" || nextFoo !== "foo"; 7 } 8}; 9 10const getFoo = createSelector( 11 ["foo"], 12 foo => !!foo, 13 selectoratorOptions 14);
Please note that if this parameter is provided and deepEqual
is also set to true
, deepEqual
will take priority and the isEqual
method will not be used.
defaults to reselect
defaultMemoize
If you want to use a custom memoizer, pass the method as this option. This will use createSelectorCreator
from reselect
internally, so consult their documentation on proper usage.
1import createSelector from "selectorator"; 2import moize from "moize"; 3 4const selectoratorOptions = { memoizer: moize }; 5 6const getFoo = createSelector( 7 ["foo"], 8 foo => !!foo, 9 selectoratorOptions 10);
defaults to []
reselect
allows you to pass parameters to the memoizer
function, and this array will translate directly into parameters 3
-n
. This is useful if your memoizer
uses something other than direct comparison for its equality test.
1import createSelector from "selectorator"; 2 3const selectoratorOptions = { 4 memoizer: memoizerThatChecksEqualToEachOtherOrToSpecificValuePassed, 5 memoizerParams: ["specificValue"] 6}; 7 8const getFoo = createSelector( 9 ["foo"], 10 foo => !!foo, 11 selectoratorOptions 12);
Standard stuff, clone the repo and npm install
dependencies. The npm scripts available:
build
=> run webpack to build development dist
file with NODE_ENV=developmentbuild:minifed
=> run webpack to build production dist
file with NODE_ENV=productiondev
=> run webpack dev server to run example app (playground!)docs
=> builds the docs via jsdoc
lint
=> run ESLint against all files in the src
folderprepublish
=> runs prepublish:compile
prepublish:compile
=> run lint
, test:coverage
, transpile
, build
, build:minified
, and docs
test
=> run AVA test functions with NODE_ENV=test
test:coverage
=> run test
but with nyc
for coverage checkertest:watch
=> run test
, but with persistent watchertranspile
=> run babel against all files in src
to create files in lib
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
Reason
project is not fuzzed
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
61 existing vulnerabilities detected
Details
Score
Last Scanned on 2024-11-25
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More