# Cookie Consent — Skecher UI

A paper-and-cobalt cookie notice with an isometric illustration that cracks into matching pieces when you accept or reject.

## Install

```bash
bunx --bun shadcn@latest add CoDesign-Spa27/skecher-ui/cookie-consent
```

## Dependencies

- motion

## Implementation guidance

- No additional implementation constraints are documented.

## Usage

```tsx
"use client";

import { useState } from "react";
import { CookieConsent } from "@/components/ui/cookie-consent";

export default function CookieConsentExample() {
  const [open, setOpen] = useState(true);

  return (
    <CookieConsent
      open={open}
      onOpenChange={setOpen}
      className="fixed bottom-6 right-6 z-50 max-w-[calc(100vw-3rem)]"
      policyHref="/cookie-policy"
      onConsent={(choice) => {
        // Persist choice and update your consent manager here.
        // onOpenChange closes the popup after confirmation.
        console.log(choice);
      }}
    />
  );
}
```

## Source files

- components/ui-components/cookie-consent.tsx — Cookie consent notice with Motion break animation

## Canonical resources

- Documentation: https://skecher-ui.com/docs/cookie-consent
- Registry item with complete source: https://skecher-ui.com/r/cookie-consent.json
- Component AI context: https://skecher-ui.com/llms/cookie-consent