.github/stale.yml

@@ -1,17 +0,0 @@
-# Number of days of inactivity before an issue becomes stale
-daysUntilStale: 30
-# Number of days of inactivity before a stale issue is closed
-daysUntilClose: 7
-# Issues with these labels will never be considered stale
-exemptLabels:
-  - pinned
-  - security
-# Label to use when marking an issue as stale
-staleLabel: wontfix
-# Comment to post when marking an issue as stale. Set to `false` to disable
-markComment: >
-  This issue has been automatically marked as stale because it has not had
-  recent activity. It will be closed if no further activity occurs. Thank you
-  for your contributions.
-# Comment to post when closing a stale issue. Set to `false` to disable
-closeComment: false

.github/workflows/gh-pages.yml

@@ -1,20 +0,0 @@
-name: Build and Deploy storybook
-on: [push]
-permissions:
-  contents: write
-jobs:
-  build-and-deploy:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout 🛎️
-        uses: actions/checkout@v3
-
-      - name: Install and Build 🔧
-        run: |
-          npm install
-          npm run build-storybook
-
-      - name: Deploy 🚀
-        uses: JamesIves/github-pages-deploy-action@v4
-        with:
-          folder: storybook-static

.github/workflows/main.yml

@@ -7,8 +7,8 @@ jobs:
     runs-on: ${{ matrix.os }}
     strategy:
       matrix:
-        node: ["10.x", "12.x", "14.x"]
+        node: ['10.x', '12.x', '14.x']
-        os: [ubuntu-latest, macOS-latest]
+        os: [ubuntu-latest, windows-latest, macOS-latest]
 
     steps:
       - name: Checkout repo

.storybook/main.js

@@ -1,10 +1,8 @@
 module.exports = {
-  stories: ["../stories/**/*.stories.@(ts|tsx|js|jsx)"],
+  stories: ['../stories/**/*.stories.@(ts|tsx|js|jsx)'],
-  addons: [
+  addons: ['@storybook/addon-links', '@storybook/addon-essentials'],
-    // '@storybook/addon-links', '@storybook/addon-essentials'
-  ],
   // https://storybook.js.org/docs/react/configure/typescript#mainjs-configuration
   typescript: {
     check: true, // type-check stories during Storybook build
-  },
+  }
 };

.vscode/settings.json

@@ -1,6 +0,0 @@
-{
-    "sonarlint.connectedMode.project": {
-        "connectionId": "public-sonarcloud",
-        "projectKey": "Mastermindzh_react-cookie-consent"
-    }
-}

CHANGELOG.md

@@ -5,23 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [[9.0.0]((https://github.com/Mastermindzh/react-cookie-consent/releases/tag/9.0.0)]
-
-Made all props optional and fixed documentation.
-Fixes [#191](https://github.com/Mastermindzh/react-cookie-consent/issues/191) and [#193](https://github.com/Mastermindzh/react-cookie-consent/issues/193)
-
-## [[8.0.1]((https://github.com/Mastermindzh/react-cookie-consent/releases/tag/8.0.1)]
-
-~~Second try of [np](https://github.com/sindresorhus/np)...~~
-Removed postinstall
-np is not my thing.. reverted to old release strategy
-
 ## [[8.0.0]((https://github.com/Mastermindzh/react-cookie-consent/releases/tag/8.0.0)]
 
 - Switched to tsdx and Typescript
 - Added storybook with examples from readme
 
-## [[7.6.0]](<https://github.com/Mastermindzh/react-cookie-consent/releases/tag/7.6.0>]
+## [[7.6.0]](https://github.com/Mastermindzh/react-cookie-consent/releases/tag/7.6.0]
 
 - Added `customButtonWrapperAttributes` prop which allows to add custom attributes to the button wrapper div
 

README.md

@@ -4,7 +4,9 @@ A small, simple and customizable cookie consent bar for use in React application
 
 [![NPM](https://nodei.co/npm/react-cookie-consent.png)](https://npmjs.org/package/react-cookie-consent)
 
-Demo (storybook): <https://mastermindzh.github.io/react-cookie-consent/>
+Demo: https://mastermindzh.github.io/react-cookie-consent/
+
+Example branch: https://github.com/Mastermindzh/react-cookie-consent/tree/example
 
 ![Downloads](https://img.shields.io/npm/dm/react-cookie-consent) ![Dependent repos (via libraries.io)](https://img.shields.io/librariesio/dependent-repos/npm/react-cookie-consent) ![GitHub contributors](https://img.shields.io/github/contributors/mastermindzh/react-cookie-consent) ![Minified size](https://img.shields.io/bundlephobia/min/react-cookie-consent) ![npm type definitions](https://img.shields.io/npm/types/react-cookie-consent) ![license-mit](https://img.shields.io/badge/license-MIT-green)
 
@@ -16,28 +18,24 @@ Demo (storybook): <https://mastermindzh.github.io/react-cookie-consent/>
 
 <!-- toc -->
 
-- [:cookie: react-cookie-consent :cookie:](#cookie-react-cookie-consent-cookie)
+- [Installation](#installation)
-  - [Default look](#default-look)
+- [Using it](#using-it)
-  - [Table of contents](#table-of-contents)
+  - [getting the cookies value in your own code](#getting-the-cookies-value-in-your-own-code)
-  - [Installation](#installation)
+- [Props](#props)
-  - [Using it](#using-it)
+- [Debugging it](#debugging-it)
-    - [getting the cookies value in your own code](#getting-the-cookies-value-in-your-own-code)
+- [Why are there two cookies? One of which named "Legacy"](#why-are-there-two-cookies-one-of-which-named-legacy)
-    - [reset the cookies value in your own code](#reset-the-cookies-value-in-your-own-code)
+- [Styling it](#styling-it)
-  - [Props](#props)
+  - [Examples](#examples)
-  - [Debugging it](#debugging-it)
+    - [Changing the bar background to red](#changing-the-bar-background-to-red)
-  - [Why are there two cookies? One of which named "Legacy"](#why-are-there-two-cookies-one-of-which-named-legacy)
+    - [Changing the button font-weight to bold](#changing-the-button-font-weight-to-bold)
-  - [Styling it](#styling-it)
+    - [Using predefined CSS classes](#using-predefined-css-classes)
-    - [Examples](#examples)
+    - [Accept on scroll](#accept-on-scroll)
-      - [Changing the bar background to red](#changing-the-bar-background-to-red)
+    - [Flipping the buttons](#flipping-the-buttons)
-      - [Changing the button font-weight to bold](#changing-the-button-font-weight-to-bold)
+    - [Extra cookie options](#extra-cookie-options)
-      - [Using predefined CSS classes](#using-predefined-css-classes)
+    - [Rainbows!](#rainbows)
-      - [Accept on scroll](#accept-on-scroll)
+    - [Overlay](#overlay)
-      - [Flipping the buttons](#flipping-the-buttons)
+- [Contributor information](#contributor-information)
-      - [Extra cookie options](#extra-cookie-options)
+- [Projects using react-cookie-consent](#projects-using-react-cookie-consent)
-      - [Rainbows](#rainbows)
-      - [Overlay](#overlay)
-  - [Contributor information](#contributor-information)
-  - [Projects using react-cookie-consent](#projects-using-react-cookie-consent)
 
 <!-- tocstop -->
 
@@ -117,12 +115,12 @@ If the decline button is enabled then the (onDecline) prop function can be used,
 
 ### getting the cookies value in your own code
 
-react-cookie-consent exports a function called `getCookieConsentValue(cookieName: string)`. You can use it in your own code like so:
+react-cookie-consent exports a function called `getCookieConsentValue`. You can use it in your own code like so:
 
 ```js
 import CookieConsent, { Cookies, getCookieConsentValue } from "react-cookie-consent";
 
-console.log(getCookieConsentValue("your_custom_cookie_name"));
+console.log(getCookieConsentValue());
 ```
 
 ### reset the cookies value in your own code
@@ -148,7 +146,7 @@ That option would be interesting if you want to allow user to change their conse
 | hideOnAccept                  |                   boolean                   | true                                 | If disabled the component will not hide it self after the accept button has been clicked. You will need to hide yourself (see onAccept) |
 | buttonText                    |          string or React component          | "I understand"                       | Text to appear on the button                                                                                                            |
 | declineButtonText             |          string or React component          | "I decline"                          | Text to appear on the decline button                                                                                                    |
-| cookieName                    |                   string                    | "CookieConsent"                      | Name of the cookie used to track whether the user has agreed. Note that you also have to pass this to the `getCookieConsentValue` and `resetCookieConsentValue` functions as they default to "CookieConsent" as well.                                                                         |
+| cookieName                    |                   string                    | "CookieConsent"                      | Name of the cookie used to track whether the user has agreed.                                                                           |
 | cookieValue                   |         string or boolean or number         | true                                 | Value to be saved under the cookieName.                                                                                                 |
 | declineCookieValue            |         string or boolean or number         | false                                | Value to be saved under the cookieName when declined.                                                                                   |
 | setDeclineCookie              |                   boolean                   | true                                 | Whether to set a cookie when the user clicks "decline"                                                                                  |
@@ -300,7 +298,7 @@ You can add more cookie options using the extraCookieOptions parameter like so:
 <CookieConsent extraCookieOptions={{ domain: "myexample.com" }}>cookie bar</CookieConsent>
 ```
 
-#### Rainbows
+#### Rainbows!
 
 ![rainbows!](https://github.com/Mastermindzh/react-cookie-consent/blob/master/images/rainbow.png?raw=true)
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-cookie-consent",
-  "version": "9.0.0",
+  "version": "8.0.0",
   "description": "A small, simple and customizable cookie consent bar for use in React applications.",
   "keywords": [
     "react",
@@ -32,7 +32,6 @@
     "analyze": "size-limit --why",
     "build": "tsdx build",
     "build-storybook": "build-storybook",
-    "install-husky": "npx husky install",
     "lint": "tsdx lint",
     "major": "npm --no-git-tag-version version major",
     "minor": "npm --no-git-tag-version version minor",
@@ -40,11 +39,8 @@
     "patch": "npm --no-git-tag-version version patch",
     "prepare": "tsdx build",
     "prettier": "prettier 'src/**/*.{js*,ts*,htm*,md,scss}' --write",
+    "postinstall": "husky install",
     "publish": "npx np",
-    "release": "npm run build && git add -A && git tag $npm_package_version && git commit -m \"release $npm_package_version\" && git push && git push --tags && npm publish",
-    "release-major": "npm run major && npm run release",
-    "release-minor": "npm run minor && npm run release",
-    "release-patch": "npm run patch && npm run release",
     "size": "size-limit",
     "start": "tsdx watch",
     "storybook": "start-storybook -p 6006",
@@ -73,7 +69,6 @@
     "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
     "babel-loader": "^8.2.5",
-    "gh-pages": "^4.0.0",
     "husky": "^8.0.1",
     "prettier": "^2.6.2",
     "react": "^18.2.0",

src/CookieConsent.props.tsx

@@ -8,54 +8,54 @@ import {
 
 export interface CookieConsentProps {
   children?: ReactNode;
-  style?: React.CSSProperties;
+  style: React.CSSProperties;
-  buttonStyle?: React.CSSProperties;
+  buttonStyle: React.CSSProperties;
-  declineButtonStyle?: React.CSSProperties;
+  declineButtonStyle: React.CSSProperties;
-  contentStyle?: React.CSSProperties;
+  contentStyle: React.CSSProperties;
-  disableStyles?: boolean;
+  disableStyles: boolean;
-  hideOnAccept?: boolean;
+  hideOnAccept: boolean;
-  hideOnDecline?: boolean;
+  hideOnDecline: boolean;
-  onAccept?: (acceptedByScrolling: boolean) => void;
+  onAccept: (acceptedByScrolling: boolean) => void;
-  onDecline?: () => void;
+  onDecline: () => void;
-  buttonText?: string | ReactNode | Function;
+  buttonText: string | ReactNode | Function;
-  declineButtonText?: string | ReactNode | Function;
+  declineButtonText: string | ReactNode | Function;
-  cookieName?: string;
+  cookieName: string;
-  cookieValue?: string | object;
+  cookieValue: string | object;
-  declineCookieValue?: string | object;
+  declineCookieValue: string | object;
-  setDeclineCookie?: boolean;
+  setDeclineCookie: boolean;
-  debug?: boolean;
+  debug: boolean;
-  expires?: number;
+  expires: number;
-  containerClasses?: string;
+  containerClasses: string;
-  contentClasses?: string;
+  contentClasses: string;
-  buttonClasses?: string;
+  buttonClasses: string;
-  buttonWrapperClasses?: string;
+  buttonWrapperClasses: string;
-  declineButtonClasses?: string;
+  declineButtonClasses: string;
-  buttonId?: string;
+  buttonId: string;
-  declineButtonId?: string;
+  declineButtonId: string;
-  overlayClasses?: string;
+  overlayClasses: string;
-  ariaAcceptLabel?: string;
+  ariaAcceptLabel: string;
-  ariaDeclineLabel?: string;
+  ariaDeclineLabel: string;
-  disableButtonStyles?: boolean;
+  disableButtonStyles: boolean;
-  enableDeclineButton?: boolean;
+  enableDeclineButton: boolean;
-  flipButtons?: boolean;
+  flipButtons: boolean;
   cookieSecurity?: boolean;
-  overlay?: boolean;
+  overlay: boolean;
-  acceptOnOverlayClick?: boolean;
+  acceptOnOverlayClick: boolean;
-  acceptOnScroll?: boolean;
+  acceptOnScroll: boolean;
-  acceptOnScrollPercentage?: number;
+  acceptOnScrollPercentage: number;
-  ButtonComponent?: any;
+  ButtonComponent: any;
-  extraCookieOptions?: Object;
+  extraCookieOptions: Object;
-  overlayStyle?: Object;
+  overlayStyle: Object;
-  customContentAttributes?: Object;
+  customContentAttributes: Object;
-  customContainerAttributes?: Object;
+  customContainerAttributes: Object;
-  customButtonProps?: Object;
+  customButtonProps: Object;
-  customDeclineButtonProps?: Object;
+  customDeclineButtonProps: Object;
-  customButtonWrapperAttributes?: Object;
+  customButtonWrapperAttributes: Object;
-  onOverlayClick?: () => void;
+  onOverlayClick: () => void;
   // these should be enums
-  location?: string;
+  location: string;
-  visible?: string;
+  visible: string;
-  sameSite?: "strict" | "Strict" | "lax" | "Lax" | "none" | "None";
+  sameSite: "strict" | "Strict" | "lax" | "Lax" | "none" | "None" | undefined;
 }
 
 const DefaultButtonComponent: FunctionComponent<{ children: ReactNode; [x: string]: any }> = ({
@@ -65,13 +65,13 @@ const DefaultButtonComponent: FunctionComponent<{ children: ReactNode; [x: strin
   return <button {...props}>{children}</button>;
 };
 
-export const defaultCookieConsentProps = {
+export const defaultCookieConsentProps: CookieConsentProps = {
   disableStyles: false,
   hideOnAccept: true,
   hideOnDecline: true,
   location: POSITION_OPTIONS.BOTTOM,
   visible: VISIBILITY_OPTIONS.BY_COOKIE_VALUE,
-  onAccept: (_acceptedByScrolling: boolean) => {},
+  onAccept: (_acceptedByScrolling) => {},
   onDecline: () => {},
   cookieName: defaultCookieConsentName,
   cookieValue: "true",

src/CookieConsent.tsx

@@ -33,10 +33,7 @@ export class CookieConsent extends Component<CookieConsentProps, CookieConsentSt
    * Set a persistent accept cookie
    */
   accept(acceptedByScrolling = false) {
-    const { cookieName, cookieValue, hideOnAccept, onAccept } = {
+    const { cookieName, cookieValue, hideOnAccept, onAccept } = this.props;
-      ...defaultCookieConsentProps,
-      ...this.props,
-    };
 
     this.setCookie(cookieName, cookieValue);
 
@@ -52,10 +49,7 @@ export class CookieConsent extends Component<CookieConsentProps, CookieConsentSt
    * Handle a click on the overlay
    */
   overlayClick() {
-    const { acceptOnOverlayClick, onOverlayClick } = {
+    const { acceptOnOverlayClick, onOverlayClick } = this.props;
-      ...defaultCookieConsentProps,
-      ...this.props,
-    };
     if (acceptOnOverlayClick) {
       this.accept();
     }
@@ -66,10 +60,8 @@ export class CookieConsent extends Component<CookieConsentProps, CookieConsentSt
    * Set a persistent decline cookie
    */
   decline() {
-    const { cookieName, declineCookieValue, hideOnDecline, onDecline, setDeclineCookie } = {
+    const { cookieName, declineCookieValue, hideOnDecline, onDecline, setDeclineCookie } =
-      ...defaultCookieConsentProps,
+      this.props;
-      ...this.props,
-    };
 
     if (setDeclineCookie) {
       this.setCookie(cookieName, declineCookieValue);
@@ -121,7 +113,7 @@ export class CookieConsent extends Component<CookieConsentProps, CookieConsentSt
    * checks whether scroll has exceeded set amount and fire accept if so.
    */
   handleScroll = () => {
-    const { acceptOnScrollPercentage } = { ...defaultCookieConsentProps, ...this.props };
+    const { acceptOnScrollPercentage } = this.props;
 
     // (top / height) - height * 100
     const rootNode = document.documentElement;

src/components/ConditionalWrapper.tsx

@@ -1,7 +1,7 @@
 import { FunctionComponent, ReactNode } from "react";
 
 type Props = {
-  condition?: boolean;
+  condition: boolean;
   wrapper: (_: ReactNode) => any;
   children: ReactNode;
 };