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

@crabas0npm/officia-amet-delectus

v1.0.0

Published

> Lerna-managed monorepo for the NICE Design System

Downloads

60

Maintainers

thanhl4861thanhl4861

Keywords

errortypedarrayscallboundES2016importArraynegativeextensionrobustmatchescallfullwidthdatastructuretakeapiObject.definePropertycopystructuredClonepropertiesindicatorES2019trimEndproppasswordsearchtoolkites-abstractjsonschemafindLastrfc4122collection.es6bluebirdfromlinuxfsruntimeautoprefixerconfigurablenopefseventsfilternamepackage managerArray.prototype.flatMapdefineyupless mixinsMapeventDispatcherwatcherfulltypanionfantasy-landconcurrencystablesymbolstrimLeftduplexerror-handlingtoStringTagwarningxsscodesjson-schemabrowserlistString.prototype.trimlanguagetimeutilreact animationtestobjectcolumnes2015readablestreamlimitES5256dom-testing-librarysetloggingwatchFileserializeArray.prototype.filterexpressioncallbackthreeECMAScript 2022lettoobjectlazypushstdlibpostcssairbnb-0busymaptesterjson-schema-validationimmutablecontainsRFC-6455flattenprototypestreamsparentjoigradients css3vardataViewmake dircomparechecksymlinkmomentwriteapolloinstallerhashidlereal-timekeyrangeerrorcss nestingUint8ClampedArraynodejs$.extendformatequaloptimizermoduleshrinkwrappopmotionconcatArray.prototype.flatplugincryptoramdadebugcompilerwaapiWebSocketscirculartestingCSSStyleDeclarationgroupBytypeerrorfindES8textenvInt8ArrayObject.entriesECMAScript 2020fixed-widthhttpoutputgroupless cssbddutilityenumerablees8sortedgdprterminalspringtyped arrayECMAScript 3redux-toolkitstatusObservableajaxfunctionjavascriptjsform-validationless.jsfast-deep-cloneuuidwindowswalkingassertionhelpersrmharmonywebsharedexit-codezeroclassnamechromedomES2020less compilerbatchnodeconcatMapcall-bindshebangpromiselibphonenumberclonemkdirstypeofRxdiffjson-schema-validatorl10nparentsbundlerlogObject.valuesworkertypesafeutil.inspectreducerworkspace:*taskflatMapwgetupformreact posefunctionalbootstrap csswhatwginvariantpipefast-copyparsedeepcloneunicodefull-widthArray.prototype.containsdeleteObject.getPrototypeOffile systemgetcomputed-typesshimPushprotocol-buffers3dYAMLserializationcreateargsgraphqllistenerspreserve-symlinkswrapcoercibleflagECMAScript 2017ansiECMAScript 2023optionbabelcurried__proto__sigtermclassnameseslintentrieshasOwnqueryaccessordotenvqspruneregexawaitreadcryptirqfaststyleprettyArrayBuffer#sliceextendObject.assignio-tsclientlengthweakmapstylesrequestschemachromiumratelimituser-streamsviewprefixReactiveXdependenciesES2021Int32ArrayjesttypescriptURLSearchParamspurees2018aststyleguidebundlinghasjsdombyteOffsetcallbindexpressArrayBuffertc39Streamsphonequotecall-boundstylingmkdirpchanneltacitasserts0termmixinsperformantcode pointseast-asian-widthsyntaxargumentArray.prototype.flattenjapaneseponyfillbreakawesomesaucepnpm9setImmediateformsa11yfastclonereduxlesscsshookformestreematchcss variableUint8ArraymochatranspileES2017arktypequeueES7jQueryisCSSUint16Arrayprotobufvalidatoroptimisthardlinkstraversetsmakeposeprogresshttpscss lessdeep-cloneJSONsafecorenegative zerogetOwnPropertyDescriptorescapereact-hookslinklimitedminimalmimetypeslinewrapthrottle.envcolumnsremoveexittslibstartergenerics[[Prototype]]picomatchvalidationpolyfilllessmime-dbassignarraystylesheetdatehandlersString.prototype.matchAlldescriptorconstfind-uptddeventsmodulesomitcoloursetPrototypeOf@@toStringTagsuperstructsettercommand-linecurlJSON-SchemaloadingurlslotutilitiesdefinePropertyglobemitpreprocessordependency managerdeepfindLastIndexBigUint64Arrayinterruptsprivate dataSymbol.toStringTagpackage.jsonefficienttranspilereslint-pluginjwtregular expressionseveryxtermTypeScriptsortESnext

Readme

:art: NICE Design System

Lerna-managed monorepo for the NICE Design System

npm GitHub release License lerna

What is it?

The NICE Design System (NDS) is a pattern library, front-end toolkit and set of guidelines for rapidly building modern, accessible digital services that are consistent with the NICE brand guidelines.

Development

We recommend using vscode as the IDE when developing with the NICE Design System. We have a set of recommended extensions you should install to make development easier. You should be prompted to install these when opening the folder in vscode.

Quick start

TL;DR:
	1. `volta install node`
	2. `npm i`
	3. `npm start`
	4. http://localhost:3000/

Slow start

To run the design system site and tests locally, first install Node. We use Volta to manage Node versions; you may need to install that first.

Then before you can run any tasks, run npm i from the command line to install dependencies from npm. This will also link local packages together and install remaining package dependencies.

Next, run npm start from the command line to run a server for local development, and view http://localhost:3000/ in a browser.

Help! I'm getting complaints about icons!

You may need to generate the icon packages first. Change to the components/icons folder, run npm i and then npm start. You should then be able to return to the root folder and run npm start again without any issues.

NextJS

The NDS docs site is built using NextJS. It can be found in the docs folder.

Tests

All the components have tests, written with Jest and React Testing Library. Run test:unit:watch to run unit tests and watch for changes.

To run tests for a just a single component, run the following:

npm run test:unit:watch -- breadcrumbs

Commands

Run npm start and test:unit:watch for development. However, there are other npm scripts available to be run for other tasks - here are some useful ones:

| Task | Description | | ---------------------------- | ------------------------------------------------------------------------------| | npm start | Runs a server for local development and watches for changes | | npm run lerna | Runs lerna under the hood | | npm run release:alpha | Runs lerna publish under the hood for an alpha release | | npm run release:latest | Runs lerna publish under the hood for the latest full release | | npm test | Lints JS and SCSS and runs JS unit tests | | npm run test:unit | Runs JS unit tests | | npm run test:unit:watch | Runs JS test tests and watches for changes to re-run tests | | npm run test:unit:coverage | Runs JS test tests and generates a coverage report | | npm run lint | Lints both JS and SCSS | | npm run lint:js | Lints just JS | | npm run lint:scss | Lints just SCSS | | npm run clean:ts | Cleans the Typescript output | | npm run build:ts | Compiles all Typescript components | | npm run docs:dev | Starts the Next.js documentation site in development mode | | npm run docs:build | Builds the Next.js documentation site for production |

Check package.json for a complete list of scripts.

Note: because lerna is installed locally, you can use npm run lerna -- to run lerna commands, for example npm run lerna -- add @nice-digital/icons --scope=@nice-digital/nds-filters

Publishing to npm

First, make sure you're logged in to npm on the command line by running npm whoami.

Please make sure 2FA is enabled on your account for at least auth, and preferably writes as well.

Next, check you have access to the @nice-digital org on npm by running npm org ls nice-digital USERNAME. It should list your username and role. You should have at least the developers role, which wiLl give you write access.

Then run npm run release to publish to npm. This runs lerna publish under the hood, which means you can pass in additional command arguments. For example to release to npm with an alpha dist tag, run the following:

npm run release:alpha