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

@cuban-engineer/react-cookies-consent

v1.0.3

Published

React component for the managing the user awareness regarding cookies usage

Downloads

5

Readme

@cuban-engineer/react-cookies-consent

code style: prettier code linting: eslint code quality: jest MIT license

React component for the managing the user awareness regarding cookies usage

Install

npm install --save @cuban-engineer/react-cookies-consent

or

yarn add @cuban-engineer/react-cookies-consent

Usage

import React, { Component } from 'react'

import CookiesConsent from '@cuban-engineer/react-cookies-consent'

class Example extends Component {
  render () {
    return (
      <CookiesConsent />
    )
  }
}

Available props

  • cookiesId Value with which the cookie will be save in the browser: (Type: String, Default value: 'cookies-consent')
  • message Message that will be show to the user: (Type String, Default value: 'Cookies help us deliver our services. By using our services, you agree to our use of cookies.')
  • buttonMessage Text of the submit action button: (Type: String, Default value: 'OK')
  • expiresIn Time needed for the cookie to expire: (Type: Number, Default value: 365)
  • link Link for more information pages: (Type: Object, Default values: { url: undefined, text: undefined, target: '_blank'})

Styling

By default the rendered component will be fixed at the bottom and will look like this:

React Cookies Consent Component

But the styles can be modified by overriding this css classes:

  1. .cookies-consent: Entire Component container.
  2. .cookies-consent-text: Container of the message showed to the user.
  3. .cookies-consent-button Container of the Button for accepting the use of cookies.
  4. .cookies-consent-link Container of the a tag for the link.

License

@cuban-engineer/react-cookies-consent is MIT-licensed.