@dorsium/gdpr
Version:
Lightweight GDPR & Cookie Consent module for Next.js projects. Built by Dorsium
93 lines (92 loc) • 3.55 kB
JavaScript
// src/components/CookieConsent.tsx
import { useEffect, useState } from "react";
import { jsx, jsxs } from "react/jsx-runtime";
var COOKIE_KEY = "dorsium_consent";
var defaultPrefs = {
analytics: false,
marketing: false
};
function CookieConsent() {
const [visible, setVisible] = useState(false);
const [prefs, setPrefs] = useState(defaultPrefs);
useEffect(() => {
const stored = localStorage.getItem(COOKIE_KEY);
if (!stored) setVisible(true);
}, []);
const handleAcceptAll = () => {
const all = { analytics: true, marketing: true };
localStorage.setItem(COOKIE_KEY, JSON.stringify(all));
setVisible(false);
};
const handleDecline = () => {
localStorage.setItem(COOKIE_KEY, JSON.stringify(defaultPrefs));
setVisible(false);
};
const handleChange = (key) => {
setPrefs({ ...prefs, [key]: !prefs[key] });
};
const handleSave = () => {
localStorage.setItem(COOKIE_KEY, JSON.stringify(prefs));
setVisible(false);
};
if (!visible) return null;
return /* @__PURE__ */ jsxs("div", { className: "fixed bottom-4 left-4 right-4 max-w-xl mx-auto bg-gray-900 text-white p-6 rounded-2xl shadow-xl z-50", children: [
/* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold flex items-center gap-2", children: "\u{1F36A} We value your privacy" }),
/* @__PURE__ */ jsx("p", { className: "text-sm text-gray-300 mt-2", children: "This website uses cookies to ensure basic functionality and to analyze traffic." }),
/* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-3 mt-4", children: [
/* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm", children: [
/* @__PURE__ */ jsx("input", { type: "checkbox", checked: true, disabled: true, className: "accent-dorsium" }),
"Necessary"
] }),
/* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm", children: [
/* @__PURE__ */ jsx(
"input",
{
type: "checkbox",
checked: prefs.analytics,
onChange: () => handleChange("analytics"),
className: "accent-dorsium"
}
),
"Analytics"
] }),
/* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm", children: [
/* @__PURE__ */ jsx(
"input",
{
type: "checkbox",
checked: prefs.marketing,
onChange: () => handleChange("marketing"),
className: "accent-dorsium"
}
),
"Marketing"
] })
] }),
/* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center mt-6", children: [
/* @__PURE__ */ jsx("button", { className: "text-sm underline", onClick: () => setVisible(false), children: "Cookie Settings" }),
/* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
/* @__PURE__ */ jsx(
"button",
{
className: "bg-gray-700 text-white px-4 py-2 rounded-lg text-sm hover:bg-gray-600",
onClick: handleDecline,
children: "Decline"
}
),
/* @__PURE__ */ jsx(
"button",
{
className: "bg-dorsium text-white px-4 py-2 rounded-lg text-sm hover:opacity-90",
onClick: handleAcceptAll,
children: "Accept All"
}
)
] })
] }),
/* @__PURE__ */ jsx("p", { className: "mt-4 text-xs text-gray-500", children: "Powered by Dorsium" })
] });
}
export {
CookieConsent
};