nuxt-x-marketing
PrivacyCookieBanner
Full-width bottom cookie consent banner with Accept, Reject, and Customize actions, persisted to localStorage.
PrivacyCookieBanner
A slide-up banner fixed to the bottom of the viewport. Persists the user's decision in localStorage under storageKey — the banner will not reappear once accepted or rejected. Emits accept, reject, and customize events.
Components
<XMarkPrivacyCookieBanner />
A slide-up banner fixed to the bottom of the viewport. Persists the user's decision in localStorage under storageKey — the banner will not reappear once accepted or rejected. Emits accept, reject, and customize events.
<XMarkPrivacyCookieBanner
title="We use cookies"
message="We use cookies to improve your experience. By continuing, you agree to our"
policy-link="/privacy"
policy-label="Privacy Policy"
:has-customize="true"
:has-reject="true"
storage-key="cookie-consent-v1"
@accept="trackConsent('accepted')"
@reject="trackConsent('rejected')"
@customize="openGdprModal"
/>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
title | String | 'We use cookies' | Banner heading |
message | String | Default message | Main message text |
policyLink | String | '/privacy' | Link URL for policy reference |
policyLabel | String | 'Learn more' | Policy link label |
hasCustomize | Boolean | false | Show "Customize" button |
hasReject | Boolean | true | Show "Reject All" button |
storageKey | String | 'cookie-consent' | localStorage key for persistence |
Emits
| Event | Description |
|---|---|
accept | User clicked Accept All |
reject | User clicked Reject All |
customize | User clicked Customize |
AI Context
category: Privacy
package: "@xenterprises/nuxt-x-marketing"
components:
- XMarkPrivacyCookieBanner
use-when: >
Implementing a prominent cookie consent banner fixed to the bottom of the
viewport. Supports Accept, Reject, and Customize actions. Pair with
XMarkPrivacyGDPR when granular category control is needed.
typical-page-section: Place in app.vue or a layout file so it appears on every page.