### Install react-cookie

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Install the react-cookie package using npm.

```bash
npm install react-cookie
```

--------------------------------

### Set and Get Cookie in Browser

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Demonstrates setting a cookie with a name and value, and then retrieving its value using the `get` method in a browser context.

```javascript
cookies.set('myCat', 'Pacman');
console.log(cookies.get('myCat')); // Pacman
```

--------------------------------

### Express Server Setup with Universal Cookies

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

This Express server setup integrates universal-cookie-express middleware to handle cookies on the server. It then uses the custom server-side rendering middleware to process requests and send the rendered HTML.

```typescript
// server.ts
import express from 'express';
import serverMiddleware from './src/server';
import cookiesMiddleware from 'universal-cookie-express';

const app = express();

app.use(cookiesMiddleware()).use(serverMiddleware);

app.listen(8080, function () {
  console.log('Listening on 8080...');
});

```

--------------------------------

### Koa Middleware Setup and Usage

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie-koa/README.md

Integrate `cookiesMiddleware` into your Koa application to access cookies via `ctx.request.universalCookies`. This allows you to get cookies within your request handlers.

```javascript
import Koa from 'koa';
import cookiesMiddleware from 'universal-cookie-koa';

const app = new Koa();

app.use(cookiesMiddleware()).use(function (ctx) {
  // get the user cookies using universal-cookie
  ctx.request.universalCookies.get('myCat');
});
```

--------------------------------

### Express Middleware Setup and Usage

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie-express/README.md

Set up the cookiesMiddleware in your Express application. Access cookies via req.universalCookies.get() within subsequent middleware or routes.

```typescript
import express, { Request, Response } from 'express';
import cookiesMiddleware from 'universal-cookie-express';

const app = express();

app.use(cookiesMiddleware()).use(function (req: Request, res: Response) {
  // get the user cookies using universal-cookie
  req.universalCookies.get('myCat');
});
```

--------------------------------

### Get Cookie on Server

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Retrieve a cookie's value on the server using the `get` method. It will return `undefined` if the cookie is not set.

```javascript
console.log(cookies.get('myCat')); // Pacman or undefined if not set yet
```

--------------------------------

### get(name, [options])

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Retrieves the value of a specific cookie by its name. An optional options object can be provided to control parsing behavior.

```APIDOC
## get(name, [options])

### Description
Get a cookie value

### Parameters
#### Path Parameters
- **name** (string): cookie name
- **options** (object): Optional. Configuration for retrieving the cookie.
  - **doNotParse** (boolean): If true, the cookie value will not be parsed into an object, regardless of its content.
```

--------------------------------

### React Cookie Provider with Default Options (Hooks)

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Set up the CookiesProvider at the root of your application to provide cookie management capabilities to all child components. This example configures a default path for all cookies set.

```tsx
import React from 'react';
import App from './App';
import { CookiesProvider } from 'react-cookie';

export default function Root(): React.ReactElement {
  return (
    <CookiesProvider defaultSetOptions={{ path: '/' }}>
      <App />
    </CookiesProvider>
  );
}
```

--------------------------------

### get(name, [options])

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Retrieves the value of a specified cookie by its name. Optionally, you can prevent the cookie value from being parsed into an object.

```APIDOC
## get(name, [options])

### Description
Get a cookie value.

### Parameters
#### name
- (string): cookie name

#### options
- (object):
  - doNotParse (boolean): do not convert the cookie into an object no matter what
```

--------------------------------

### Using withCookies HOC for Cookie Management

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Illustrates how to use the `withCookies` higher-order component to inject cookie management capabilities into a class component. It shows how to get, set, and manage state based on cookie values.

```tsx
import React, { Component } from 'react';
import { withCookies, Cookies, ReactCookieProps } from 'react-cookie';

import NameForm from './NameForm';

interface State {
  name: string;
}

interface Props extends ReactCookieProps {
  cookies: Cookies;
}

class App extends Component<Props, State> {
  constructor(props: Props) {
    super(props);

    const { cookies } = props;
    this.state = {
      name: cookies.get('name') || 'Ben',
    };
  }

  handleNameChange(name: string): void {
    const { cookies } = this.props;

    cookies.set('name', name, { path: '/' });
    this.setState({ name });
  }

  render(): React.ReactNode {
    const { name } = this.state;

    return (
      <div>
        <NameForm name={name} onChange={this.handleNameChange.bind(this)} />
        {this.state.name && <h1>Hello {this.state.name}!</h1>}
      </div>
    );
  }
}

export default withCookies(App);
```

--------------------------------

### Set a Cookie with Default Path

Source: https://github.com/itsbencodes/cookies/wiki/Getting-Started

Use the `setCookie` function to store a cookie. By default, cookies are path-specific. This example shows setting a cookie without specifying a path, which might limit its availability to certain routes.

```javascript
// pages/blog/login.jsx
export default function Login(newUserToken) {
  return (
    <button onClick={() => setCookie("token", newUserToken)}>Login!</button>
  )
}
```

--------------------------------

### Using useCookies Hook for Cookie Management

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Demonstrates how to use the `useCookies` hook in a functional component to get and set cookie values. It includes type definitions for cookie values and a handler for updating a 'name' cookie.

```tsx
import React from 'react';
import { useCookies } from 'react-cookie';

import NameForm from './NameForm';

interface CookieValues {
  name?: string;
}

function App(): React.ReactElement {
  const [cookies, setCookie] = useCookies<'name', CookieValues>(['name']);

  function onChange(newName: string): void {
    setCookie('name', newName);
  }

  return (
    <div>
      <NameForm name={cookies.name || ''} onChange={onChange} />
      {cookies.name && <h1>Hello {cookies.name}!</h1>}
    </div>
  );
}

export default App;
```

--------------------------------

### React Cookie Provider without Default Options (HOC)

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Configure the CookiesProvider at the root of your application when using the higher-order component approach. This setup does not specify default options.

```tsx
import React from 'react';
import App from './App';
import { CookiesProvider } from 'react-cookie';

export default function Root(): React.ReactElement {
  return (
    <CookiesProvider>
      <App />
    </CookiesProvider>
  );
}
```

--------------------------------

### Initialize Cookies on Server

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Instantiate the Cookies class on the server, passing the request's cookie header. This allows access to cookies sent by the client.

```javascript
import Cookies from 'universal-cookie';

const cookies = new Cookies(req.headers.cookie, { path: '/' });
```

--------------------------------

### Initialize CookiesProvider

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Wrap your application with CookiesProvider to set default cookie options. On the server, the 'cookies' prop must be provided.

```jsx
<CookiesProvider defaultSetOptions={ { path: '/' } }>
  <App />
</CookiesProvider>
```

--------------------------------

### Initialize Cookies in Browser

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Instantiate the Cookies class in a browser environment. The constructor accepts an optional cookie header and default options for setting cookies.

```javascript
import Cookies from 'universal-cookie';

const cookies = new Cookies(null, { path: '/' });
```

--------------------------------

### Load and Set Cookie with Universal Cookie

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/umd-sandbox.html

Initializes UniversalCookie, sets a 'data_cookie' with provided data and an expiration, and then displays the retrieved cookie value. Ensure the UniversalCookie library is loaded before this script.

```javascript
function load() { var data = '{{data}}'; var cookies = new UniversalCookie(null, { path: '/' }); cookies.set('data_cookie', data, { expires: data.expires_at, }); document.body.innerHTML = cookies.get('data_cookie'); } window.onload = load;
```

--------------------------------

### Client-Side Hydration with CookiesProvider

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

The client-side entry point uses createRoot to render the App component, wrapping it in a CookiesProvider. This allows the client to pick up cookies from the browser and hydrate the React application.

```typescript
// src/client.ts
import React from 'react';
import { createRoot } from 'react-dom/client';
import { CookiesProvider } from 'react-cookie';

import App from './components/App';

const root = createRoot(document.getElementById('main-app'));

root.render(
  <CookiesProvider>
    <App />
  </CookiesProvider>,
);

```

--------------------------------

### getAll([options])

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Retrieves all cookies accessible to the application. An optional options object can be provided to control parsing behavior.

```APIDOC
## getAll([options])

### Description
Get all cookies

### Parameters
#### Path Parameters
- **options** (object): Optional. Configuration for retrieving all cookies.
  - **doNotParse** (boolean): If true, cookie values will not be parsed into objects, regardless of their content.
```

--------------------------------

### Cookies Constructor

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Initializes a new Cookies instance. You can provide an initial cookie header (from a server request) or an object of cookies, and default options for setting cookies.

```APIDOC
## constructor([cookieHeader], [defaultSetOptions])

### Description
Create a cookies context.

### Parameters
#### cookieHeader
- (string|object) - specify the cookie header or object

#### defaultSetOptions
- (object) - specify the default options when setting cookies
  - path (string): cookie path, use `/` as the path if you want your cookie to be accessible on all pages
  - expires (Date): absolute expiration date for the cookie
  - maxAge (number): relative max age of the cookie from when the client receives it in seconds
  - domain (string): domain for the cookie (sub.domain.com or .allsubdomains.com)
  - secure (boolean): Is only accessible through HTTPS?
  - httpOnly (boolean): Is only the server can access the cookie? **Note: You cannot get or set httpOnly cookies from the browser, only the server.**
  - sameSite (boolean|none|lax|strict): Strict or Lax enforcement
  - partitioned (boolean): Indicates that the cookie should be stored using partitioned storage
```

--------------------------------

### Include react-cookie in Browser

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Include react-cookie and its dependencies via CDN for browser usage. Ensure React and universal-cookie are loaded first.

```html
<script
  crossorigin
  src="https://unpkg.com/react@16/umd/react.production.js"
></script>
<script
  crossorigin
  src="https://unpkg.com/universal-cookie@7/umd/universalCookie.min.js"
></script>
<script
  crossorigin
  src="https://unpkg.com/react-cookie@7/umd/reactCookie.min.js"
></script>
```

--------------------------------

### getAll([options])

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Retrieves all cookies currently stored. You can specify an option to prevent all cookie values from being parsed into objects.

```APIDOC
## getAll([options])

### Description
Get all cookies.

### Parameters
#### options
- (object):
  - doNotParse (boolean): do not convert the cookie into an object no matter what
```

--------------------------------

### Set User Cookie in React

Source: https://github.com/itsbencodes/cookies/wiki/Home

Demonstrates how to set a 'User' cookie with a given username using the useCookies hook from react-cookie. Ensure the hook is imported and initialized.

```typescript
import { useCookies } from 'react-cookie';
const [cookies, setCookie, removeCookie] = useCookies(['User']);

function onLogin(username: string) {
  setCookie("User", username);
}
```

--------------------------------

### set(name, value, [options])

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Sets a cookie with a specified name, value, and optional configuration. Supports all standard RFC 6265 cookie options.

```APIDOC
## set(name, value, [options])

### Description
Set a cookie value

### Parameters
#### Path Parameters
- **name** (string): cookie name
- **value** (string|object): The value to set for the cookie. If an object is provided, it will be stringified.
- **options** (object): Optional. Configuration for setting the cookie. Supports all RFC 6265 cookie options.
  - **path** (string): The path for the cookie. Defaults to '/'.
  - **expires** (Date): The absolute expiration date for the cookie.
  - **maxAge** (number): The relative maximum age of the cookie in seconds.
  - **domain** (string): The domain for the cookie (e.g., 'sub.domain.com' or '.allsubdomains.com').
  - **secure** (boolean): If true, the cookie is only accessible through HTTPS.
  - **httpOnly** (boolean): If true, the cookie is only accessible by the server. Note: Cannot be accessed from the browser.
  - **sameSite** (boolean|'none'|'lax'|'strict'): The SameSite attribute for the cookie.
  - **partitioned** (boolean): Indicates that the cookie should be stored using partitioned storage.
```

--------------------------------

### Server-Side Rendering with CookiesProvider

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

The server-side rendering logic uses ReactDOMServer.renderToString within a CookiesProvider to hydrate the application with server-provided cookies. This ensures that the initial render on the server has access to the correct cookie state.

```typescript
// src/server.ts
import React from 'react';
import ReactDOMServer from 'react-dom/server';
import { CookiesProvider } from 'react-cookie';
import { Request, Response } from 'express';

import Html from './components/Html';
import App from './components/App';

export default function middleware(req: Request, res: Response) {
  const markup = ReactDOMServer.renderToString(
    <CookiesProvider cookies={req.universalCookies}>
      <App />
    </CookiesProvider>,
  );

  const html = ReactDOMServer.renderToStaticMarkup(<Html markup={markup} />);

  res.send('<!DOCTYPE html>' + html);
}
```

--------------------------------

### Use useCookies with Options

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Configure the useCookies hook with options like 'doNotParse' to control cookie handling. 'doNotParse' prevents automatic parsing of cookie values.

```jsx
const [cookies, setCookie, removeCookie] = useCookies(['cookie-name'], {
  doNotParse: true,
});
```

--------------------------------

### set(name, value, [options])

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Sets a cookie with a given name and value. Supports a wide range of options as defined by RFC 6265 for controlling cookie behavior.

```APIDOC
## set(name, value, [options])

### Description
Set a cookie value.

### Parameters
#### name
- (string): cookie name

#### value
- (string|object): save the value and stringify the object if needed

#### options
- (object): Support all the cookie options from RFC 6265
  - path (string): cookie path, use `/` as the path if you want your cookie to be accessible on all pages
  - expires (Date): absolute expiration date for the cookie
  - maxAge (number): relative max age of the cookie from when the client receives it in seconds
  - domain (string): domain for the cookie (sub.domain.com or .allsubdomains.com)
  - secure (boolean): Is only accessible through HTTPS?
  - httpOnly (boolean): Is only the server can access the cookie? **Note: You cannot get or set httpOnly cookies from the browser, only the server.**
  - sameSite (boolean|none|lax|strict): Strict or Lax enforcement
  - partitioned (boolean): Indicates that the cookie should be stored using partitioned storage
```

--------------------------------

### Set a Cookie

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Use the setCookie function returned by useCookies to set a cookie's value. It accepts the cookie name, value, and optional configuration options.

```javascript
setCookie('cookie-name', 'value', {
  path: '/',
  expires: new Date(Date.now() + 86400),
  maxAge: 3600
});
```

--------------------------------

### Import and Initialize react-cookie

Source: https://github.com/itsbencodes/cookies/wiki/Getting-Started

Import the `useCookies` hook from 'react-cookie' to manage cookies. This hook provides functions to interact with cookies within your React components.

```html
<script
  crossorigin
  src="https://unpkg.com/universal-cookie@3/umd/universalCookie.min.js"
></script>
<script
  crossorigin
  src="https://unpkg.com/react-cookie@3/umd/reactCookie.min.js"
></script>
```

```javascript
import { useCookies } from "react-cookie";

const [cookies, setCookie, removeCookie] = useCookies(["token"]);
```

--------------------------------

### CookiesProvider

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

The CookiesProvider component allows you to set default options for all cookies within your application. It should be wrapped around your application or the relevant part that needs cookie management. On the server, the 'cookies' prop must be set using req.universalCookies or new Cookie(cookieHeader).

```APIDOC
## `<CookiesProvider defaultSetOptions />`

Set the user cookies

On the server, the `cookies` props must be set using `req.universalCookies` or `new Cookie(cookieHeader)`

- defaultSetOptions: You can set default values for when setting cookies.
```

--------------------------------

### Set a Cookie with a Specific Path

Source: https://github.com/itsbencodes/cookies/wiki/Getting-Started

To ensure a cookie is accessible across your entire application, specify the path as "/" when calling `setCookie`. This makes the cookie available on all routes.

```javascript
// pages/blog/login.jsx
export default function Login(newUserToken) {
  return (
    <button onClick={() => setCookie("token", newUserToken, {path: "/"})}>Login!</button>
  )
}
```

--------------------------------

### update()

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Manually triggers a read of the current cookies from the browser and updates the internal state, also invoking change listeners. This is typically not needed as the library usually detects changes automatically.

```APIDOC
## update()

### Description
Read back the cookies from the browser and triggers the change listeners. This should normally not be necessary because this library detects cookie changes automatically.
```

--------------------------------

### Include Universal Cookie in Browser

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Include the universal-cookie library in your HTML for browser-based usage. This makes the `UniversalCookie` global variable available.

```html
<script
  crossorigin
  src="https://unpkg.com/universal-cookie@7/umd/universalCookie.min.js"
></script>
```

--------------------------------

### addChangeListener(callback)

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Registers a callback function that will be invoked whenever a cookie is set or removed. The callback receives details about the changed cookie.

```APIDOC
## addChangeListener(callback)

### Description
Add a listener to when a cookie is set or removed.

### Parameters
#### callback
- (function): Call that will be called with the first argument containing `name`, `value` and `options` of the changed cookie.
```

--------------------------------

### View and Remove Cookies

Source: https://github.com/itsbencodes/cookies/wiki/Getting-Started

Access the `cookies` object to display cookie values and use `removeCookie` to delete a specific cookie. Ensure the correct path is provided when removing a cookie to match where it was set.

```javascript
// pages/blog/login.jsx
export default function Login(newUserToken) {
  return (
    <>
      <button onClick={() => setCookie("token", newUserToken, {path: "/"})}>Login!</button>
      <p> See your cookie: {cookies.token}</p>
      <button onClick={() => removeCookie("token", {path: "/"})}>Login!</button>
    </>
  )
}
```

--------------------------------

### remove(name, [options])

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Removes a specified cookie by its name. Similar to `set`, it accepts RFC 6265 options for precise removal targeting.

```APIDOC
## remove(name, [options])

### Description
Remove a cookie.

### Parameters
#### name
- (string): cookie name

#### options
- (object): Support all the cookie options from RFC 6265
  - path (string): cookie path, use `/` as the path if you want your cookie to be accessible on all pages
  - expires (Date): absolute expiration date for the cookie
  - maxAge (number): relative max age of the cookie from when the client receives it in seconds
  - domain (string): domain for the cookie (sub.domain.com or .allsubdomains.com)
  - secure (boolean): Is only accessible through HTTPS?
  - httpOnly (boolean): Is only the server can access the cookie? **Note: You cannot get or set httpOnly cookies from the browser, only the server.**
  - sameSite (boolean|none|lax|strict): Strict or Lax enforcement
  - partitioned (boolean): Indicates that the cookie should be stored using partitioned storage
```

--------------------------------

### remove(name, [options])

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Removes a cookie by its name. Optional configuration options can be provided, including those from RFC 6265.

```APIDOC
## remove(name, [options])

### Description
Remove a cookie

### Parameters
#### Path Parameters
- **name** (string): cookie name
- **options** (object): Optional. Configuration for removing the cookie. Supports all RFC 6265 cookie options.
  - **path** (string): The path for the cookie. Defaults to '/'.
  - **expires** (Date): The absolute expiration date for the cookie.
  - **maxAge** (number): The relative maximum age of the cookie in seconds.
  - **domain** (string): The domain for the cookie (e.g., 'sub.domain.com' or '.allsubdomains.com').
  - **secure** (boolean): If true, the cookie is only accessible through HTTPS.
  - **httpOnly** (boolean): If true, the cookie is only accessible by the server. Note: Cannot be accessed from the browser.
  - **sameSite** (boolean|'none'|'lax'|'strict'): The SameSite attribute for the cookie.
  - **partitioned** (boolean): Indicates that the cookie should be stored using partitioned storage.
```

--------------------------------

### Client-Side App Component with Cookies

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

The client-side App component uses the useCookies hook to manage and display cookie data. It integrates with a NameForm component to allow users to set a 'name' cookie.

```typescript
// src/components/App.ts
import React from 'react';
import { useCookies } from 'react-cookie';

import NameForm from './NameForm';

function App() {
  const [cookies, setCookie] = useCookies(['name']);

  function onChange(newName: string) {
    setCookie('name', newName, { path: '/' });
  }

  return (
    <div>
      <NameForm name={cookies.name} onChange={onChange} />
      {cookies.name && <h1>Hello {cookies.name}!</h1>}
    </div>
  );
}

export default App;
```

--------------------------------

### withCookies HOC

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

The withCookies higher-order component (HOC) allows you to inject cookie access into class components. It provides the component with 'cookies' and 'allCookies' props, enabling easy interaction with cookies within the component's lifecycle.

```APIDOC
## `withCookies(Component)`

Give access to your cookies anywhere. Add the following props to your component:

- cookies: Cookies instance allowing you to get, set and remove cookies.
- allCookies: All your current cookies in an object.

Your original static properties will be hoisted on the returned component. You can also access the original component by using the `WrappedComponent` static property. Example:

```jsx
function MyComponent() {
  return null;
}
const NewComponent = withCookies(MyComponent);
NewComponent.WrappedComponent === MyComponent;
```
```

--------------------------------

### Use withCookies Higher-Order Component

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Wrap a component with the withCookies HOC to inject 'cookies' and 'allCookies' props. This provides access to cookie management functions for class components.

```jsx
function MyComponent() {
  return null;
}
const NewComponent = withCookies(MyComponent);
NewComponent.WrappedComponent === MyComponent;
```

--------------------------------

### Update Cookies Manually

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Call updateCookies() to manually refresh the cookies from the browser and trigger change listeners. This is typically not needed as changes are detected automatically.

```javascript
updateCookies();
```

--------------------------------

### Use useCookies Hook

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Access and modify cookies within functional components using the useCookies hook. It returns the current cookies object, a setCookie function, and a removeCookie function.

```jsx
const [cookies, setCookie, removeCookie] = useCookies(['cookie-name']);
```

--------------------------------

### useCookies Hook

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

The useCookies hook provides access to cookie management functions within functional React components. It returns an array containing the current cookies object, a function to set cookies, and a function to remove cookies. It supports optional dependencies to trigger re-renders only when specific cookies change and optional options to control parsing and updates.

```APIDOC
## `useCookies([dependencies], [options])`

Access and modify cookies using React hooks.

```jsx
const [cookies, setCookie, removeCookie] = useCookies(['cookie-name']);
```

**React hooks are available starting from React 16.8**

### `dependencies` (optional)

Let you optionally specify a list of cookie names your component depend on or that should trigger a re-render. If unspecified, it will render on every cookie change.

### `options` (optional)

- options (object):
  - doNotParse (boolean): do not convert the cookie into an object no matter what
  - doNotUpdate (boolean): do not update the cookies when the component mounts

```jsx
const [cookies, setCookie, removeCookie] = useCookies(['cookie-name'], {
  doNotParse: true,
});
```

### `cookies`

Javascript object with all your cookies. The key is the cookie name.

### `setCookie(name, value, [options])`

Set a cookie value

- name (string): cookie name
- value (string|object): save the value and stringify the object if needed
- options (object): Support all the cookie options from RFC 6265
  - path (string): cookie path, use `/` as the path if you want your cookie to be accessible on all pages
  - expires (Date): absolute expiration date for the cookie
  - maxAge (number): relative max age of the cookie from when the client receives it in seconds
  - domain (string): domain for the cookie (sub.domain.com or .allsubdomains.com)
  - secure (boolean): Is only accessible through HTTPS?
  - httpOnly (boolean): Can only the server access the cookie? **Note: You cannot get or set httpOnly cookies from the browser, only the server.**
  - sameSite (boolean|none|lax|strict): Strict or Lax enforcement
  - partitioned (boolean): Indicates that the cookie should be stored using partitioned storage

### `removeCookie(name, [options])`

Remove a cookie

- name (string): cookie name
- options (object): Support all the cookie options from RFC 6265
  - path (string): cookie path, use `/` as the path if you want your cookie to be accessible on all pages
  - expires (Date): absolute expiration date for the cookie
  - maxAge (number): relative max age of the cookie from when the client receives it in seconds
  - domain (string): domain for the cookie (sub.domain.com or .allsubdomains.com)
  - secure (boolean): Is only accessible through HTTPS?
  - httpOnly (boolean): Can only the server access the cookie? **Note: You cannot get or set httpOnly cookies from the browser, only the server.**
  - sameSite (boolean|none|lax|strict): Strict or Lax enforcement
  - partitioned (boolean): Indicates that the cookie should be stored using partitioned storage

### `updateCookies()`

Read back the cookies from the browser and triggers the change listeners. This should normally not be necessary because this library detects cookie changes automatically.
```

--------------------------------

### Remove a Cookie

Source: https://github.com/itsbencodes/cookies/blob/main/packages/react-cookie/README.md

Use the removeCookie function to delete a cookie by its name. Optional configuration options can be provided, similar to setCookie.

```javascript
removeCookie('cookie-name', {
  path: '/'
});
```

--------------------------------

### removeAllChangeListeners()

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Removes all registered change listener callbacks, effectively disabling all cookie change notifications.

```APIDOC
## removeAllChangeListeners()

### Description
Remove all change listeners that were previously added with `addChangeListener()`.
```

--------------------------------

### removeChangeListener(callback)

Source: https://github.com/itsbencodes/cookies/blob/main/packages/universal-cookie/README.md

Removes a previously registered change listener callback, preventing it from being invoked on future cookie changes.

```APIDOC
## removeChangeListener(callback)

### Description
Remove a listener from the change callback.
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.