{"id":27051064,"url":"https://github.com/lukaskupczyk/react-hook-consent","last_synced_at":"2025-07-16T05:39:34.753Z","repository":{"id":65143551,"uuid":"582445099","full_name":"lukaskupczyk/react-hook-consent","owner":"lukaskupczyk","description":"React consent management solution for cookies and (external) scripts.","archived":false,"fork":false,"pushed_at":"2024-02-29T21:38:24.000Z","size":1792,"stargazers_count":16,"open_issues_count":3,"forks_count":5,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-06-12T02:52:26.919Z","etag":null,"topics":["consent","consent-management","hook","hooks","react","react-hooks","typescript"],"latest_commit_sha":null,"homepage":"https://lukaskupczyk.github.io/react-hook-consent/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lukaskupczyk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-12-26T21:25:08.000Z","updated_at":"2025-03-30T00:50:13.000Z","dependencies_parsed_at":"2023-02-09T15:30:54.403Z","dependency_job_id":"45de7b0d-be05-4eb2-bc61-2df259a2ebf5","html_url":"https://github.com/lukaskupczyk/react-hook-consent","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/lukaskupczyk/react-hook-consent","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lukaskupczyk%2Freact-hook-consent","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lukaskupczyk%2Freact-hook-consent/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lukaskupczyk%2Freact-hook-consent/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lukaskupczyk%2Freact-hook-consent/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lukaskupczyk","download_url":"https://codeload.github.com/lukaskupczyk/react-hook-consent/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lukaskupczyk%2Freact-hook-consent/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265276360,"owners_count":23739174,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["consent","consent-management","hook","hooks","react","react-hooks","typescript"],"created_at":"2025-04-05T08:28:36.189Z","updated_at":"2025-07-16T05:39:34.719Z","avatar_url":"https://github.com/lukaskupczyk.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![publish workflow](https://github.com/lukaskupczyk/react-hook-consent/actions/workflows/publish.yml/badge.svg)\n[![Test Coverage](https://api.codeclimate.com/v1/badges/807f879a42c4aa48c475/test_coverage)](https://codeclimate.com/github/lukaskupczyk/react-hook-consent/test_coverage)\n[![npm version](https://badge.fury.io/js/react-hook-consent.svg)](https://badge.fury.io/js/react-hook-consent)\n[![MIT License](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)\n\n# react-hook-consent\n\nReact consent management solution and banner for cookies, local storage, session storage and (external) scripts.\n\n![react-hook-consent Screenshot](/assets/screenshot.png)\n\n## Demo\n\nCheck out the [CodeSandbox](https://codesandbox.io/s/example-react18-7d1rcb) for a working example.\n\n## Documentation\n\n-   [Documentation](https://lukaskupczyk.github.io/react-hook-consent/)\n\n## Features\n\n-   Provides the consent context to components\n-   Loads (external) scripts based on consent state\n-   Deletes cookies, local storage and session storage when consent declined\n-   Hook to retrieve and change the current consent\n-   Optional Banner with detailed settings to approve / decline consent\n-   Persists the selection to local storage\n-   Ready for Next.js\n-   Dark and light mode\n-   Styling via css\n\n## Installation\n\n```bash\nyarn add react-hook-consent\n\n# or\n\nnpm install react-hook-consent\n```\n\n## Basic usage\n\nWrap the application in the `ConsentProvider`. Provide settings via the `options` prop. Optionally use the `ConsentBanner` component to display a consent banner to the user.\n\n```typescript\n/*\n * index.tsx\n */\n\nimport { ConsentBanner, ConsentProvider } from 'react-hook-consent';\n\n// styling\nimport 'react-hook-consent/dist/styles/style.css';\n\n// ...\n\u003cConsentProvider\n    options={{\n        services: [\n            {\n                id: 'myid',\n                name: 'MyName',\n                scripts: [\n                    { id: 'external-script', src: 'https://myscript.com/script.js' },\n                    { id: 'inline-code', code: `alert(\"I am a JavaScript code\");` },\n                ],\n                cookies: [{ pattern: 'cookie-name' }, { pattern: /regex/ }],\n                localStorage: ['local-storage-key'],\n                sessionStorage: ['session-storage-key'],\n                mandatory: true,\n            },\n        ],\n        // customHash: 'my-custom-hash', // optional, e.g. when changing the options based on language\n        theme: 'light',\n    }}\n\u003e\n    \u003cApp /\u003e\n    \u003cConsentBanner\n        settings={{ hidden: false, label: 'More', modal: { title: 'Modal title' } }}\n        decline={{ hidden: false, label: 'No' }}\n        approve={{ label: 'Yes' }}\n    \u003e\n        \u003c\u003e\n            Can we use cookies and external services according to our \u003ca href=\"test\"\u003eprivacy policy\u003c/a\u003e to improve the\n            browsing experience?\n        \u003c/\u003e\n    \u003c/ConsentBanner\u003e\n\u003c/ConsentProvider\u003e;\n// ...\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flukaskupczyk%2Freact-hook-consent","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flukaskupczyk%2Freact-hook-consent","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flukaskupczyk%2Freact-hook-consent/lists"}