  
npm install react-tailwind-cookiesA React component library for handling cookie consent banners, styled with Tailwind CSS.
To install the library, use npm or yarn:
``bash`
npm install react-tailwind-cookies
or
`bash`
yarn add react-tailwind-cookies
To use the CookieBanner component, import it into your project and include it in your component tree.
`jsx
import React from "react";
import "react-tailwind-cookies/dist/tailwind.css"; // Import the CSS
import { CookieBanner } from "react-tailwind-cookies";
const App = () => {
return (
export default App;
`
| Prop | Type | Default | Description |
| ----------------------------------------------------------------------------------------------- | -------- | -------- | ------------------------------------------------------------------------------ |
| cookieName | string | | The name of the cookie to store the user's preference. |classNames
| | object | | An object to customize the CSS class names for various parts of the component. |container
| | string | | CSS class for the container of the cookie banner. |banner
| | string | | CSS class for the banner. |message
| | string | | CSS class for the message. |title
| | string | | CSS class for the title. |description
| | string | | CSS class for the description. |buttons
| | object | | CSS classes for the buttons. |container
| | string | | CSS class for the container of the buttons. |accept
| | string | | CSS class for the accept button. |reject
| | string | | CSS class for the reject button. |configure
| | string | | CSS class for the configure button. |cookieConfigurator
| | object | | An object to customize the CSS class names for the cookie configurator. |container
| | string | | CSS class for the configurator container. |overlay
| | string | | CSS class for the overlay. |modal
| | object | | An object to customize the CSS class names for the modal. |container
| | string | | CSS class for the modal container. |title
| | string | | CSS class for the modal title. |cookieTitle
| | string | | CSS class for the cookie title. |description
| | string | | CSS class for the modal description. |cookies
| | object | | An object to customize the CSS class names for the cookies section. |container
| | string | | CSS class for the cookies container. |switchClassNames
| | object | | An object to customize the CSS class names for the switch elements. |container
| | string | | CSS class for the switch container. |label
| | string | | CSS class for the switch label. |input
| | string | | CSS class for the switch input. |title
| | string | | The title of the cookie banner. |description
| | string | | The description text of the cookie banner. |acceptButtonLabel
| | string | "Accept" | The label for the accept button. |rejectButtonLabel
| | string | "Reject" | The label for the reject button. |acceptAllButtonLabel
| | string | | The label for the accept all button. |position
| | string | "bottom" | The position of the cookie banner, either "top" or "bottom". |hasRejectButton
| | boolean | true | Whether to show the reject button. |selectedCookies
| | string[] | | An array of selected cookies. |configureTitle
| | string | | The title for the configure section. |configureButtonLabel
| | string | | The label for the configure button. |viewMoreLinkLabel
| | string | | The label for the view more link. |viewMoreLinkPath
| | string | | The path for the view more link. |hasViewMoreLink
| | boolean | | Whether to show the view more link. |configureDescription
| | string | | The description for the configure section. |configureCookiesTitle
| | string | | The title for the configure cookies section. |hasConfigureButton
| | boolean | false | Whether to show the configure button. |configurableCookies
| | string[] | | An array of configurable cookies. |hasAcceptAllButton
| | boolean | false | Whether to show the accept all button. |onAccept
| | function | | Callback function to be called when cookies are accepted. |onReject
| | function | | Callback function to be called when cookies are rejected. |onAcceptAll` | function | | Callback function to be called when all cookies are accepted. |
|
If you have suggestions for how this library could be improved, or want to report a bug, open an issue! We'd love all and any contributions.
This project is licensed under the MIT License.