@tantainnovative/ndpr-toolkit
Version:
Nigerian Data Protection Compliance Toolkit for implementing NDPR and DPA compliant features
1 lines • 13.3 kB
Source Map (JSON)
{"version":3,"sources":["../src/contexts/ConsentContext.tsx","../src/components/consent/unstyled/UnstyledConsentBanner.tsx","../src/components/consent/unstyled/UnstyledConsentSettings.tsx","../src/components/consent/unstyled/UnstyledConsentToggle.tsx"],"names":["ConsentContext","createContext","useConsent","context","useContext","UnstyledConsentBanner","className","children","showBanner","acceptAll","rejectAll","openSettings","React","cookieCategories","UnstyledConsentSettings","showSettings","consentState","updateConsent","savePreferences","closeSettings","handleSave","category","e","UnstyledConsentToggle","label"],"mappings":"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","file":"unstyled.mjs","sourcesContent":["import React, { createContext, useContext, useState, useCallback, useEffect, ReactNode } from 'react';\n\nexport interface ConsentCategories {\n necessary: boolean;\n analytics: boolean;\n marketing: boolean;\n functional: boolean;\n [key: string]: boolean;\n}\n\nexport interface ConsentState {\n hasUserConsented: boolean;\n consentState: ConsentCategories;\n showBanner: boolean;\n showSettings: boolean;\n}\n\nexport interface ConsentActions {\n acceptAll: () => void;\n rejectAll: () => void;\n savePreferences: (preferences: Partial<ConsentCategories>) => void;\n openSettings: () => void;\n closeSettings: () => void;\n updateConsent: (category: keyof ConsentCategories, value: boolean) => void;\n}\n\nexport interface ConsentContextValue extends ConsentState, ConsentActions {}\n\nconst ConsentContext = createContext<ConsentContextValue | undefined>(undefined);\n\nexport interface ConsentProviderProps {\n children: ReactNode;\n initialConsent?: Partial<ConsentCategories>;\n onConsentChange?: (consent: ConsentCategories) => void;\n storageKey?: string;\n}\n\nconst defaultConsent: ConsentCategories = {\n necessary: true, // Always true\n analytics: false,\n marketing: false,\n functional: false,\n};\n\nexport function ConsentProvider({\n children,\n initialConsent = {},\n onConsentChange,\n storageKey = 'ndpr-consent',\n}: ConsentProviderProps) {\n const [consentState, setConsentState] = useState<ConsentCategories>(() => {\n // Try to load from localStorage\n if (typeof window !== 'undefined') {\n const stored = localStorage.getItem(storageKey);\n if (stored) {\n try {\n const parsed = JSON.parse(stored);\n return { ...defaultConsent, ...parsed };\n } catch (e) {\n console.error('Failed to parse consent from localStorage', e);\n }\n }\n }\n return { ...defaultConsent, ...initialConsent };\n });\n\n const [hasUserConsented, setHasUserConsented] = useState(() => {\n if (typeof window !== 'undefined') {\n return localStorage.getItem(`${storageKey}-set`) === 'true';\n }\n return false;\n });\n\n const [showBanner, setShowBanner] = useState(!hasUserConsented);\n const [showSettings, setShowSettings] = useState(false);\n\n // Persist consent to localStorage\n useEffect(() => {\n if (typeof window !== 'undefined' && hasUserConsented) {\n localStorage.setItem(storageKey, JSON.stringify(consentState));\n localStorage.setItem(`${storageKey}-set`, 'true');\n }\n }, [consentState, hasUserConsented, storageKey]);\n\n // Notify parent of consent changes\n useEffect(() => {\n if (hasUserConsented && onConsentChange) {\n onConsentChange(consentState);\n }\n }, [consentState, hasUserConsented, onConsentChange]);\n\n const acceptAll = useCallback(() => {\n const newConsent: ConsentCategories = {\n necessary: true,\n analytics: true,\n marketing: true,\n functional: true,\n };\n setConsentState(newConsent);\n setHasUserConsented(true);\n setShowBanner(false);\n setShowSettings(false);\n }, []);\n\n const rejectAll = useCallback(() => {\n const newConsent: ConsentCategories = {\n necessary: true,\n analytics: false,\n marketing: false,\n functional: false,\n };\n setConsentState(newConsent);\n setHasUserConsented(true);\n setShowBanner(false);\n setShowSettings(false);\n }, []);\n\n const savePreferences = useCallback((preferences: Partial<ConsentCategories>) => {\n setConsentState(prev => ({\n ...prev,\n ...preferences,\n necessary: true, // Always keep necessary as true\n }));\n setHasUserConsented(true);\n setShowBanner(false);\n setShowSettings(false);\n }, []);\n\n const updateConsent = useCallback((category: keyof ConsentCategories, value: boolean) => {\n if (category === 'necessary') return; // Can't change necessary cookies\n \n setConsentState(prev => ({\n ...prev,\n [category]: value,\n }));\n }, []);\n\n const openSettings = useCallback(() => {\n setShowSettings(true);\n setShowBanner(false);\n }, []);\n\n const closeSettings = useCallback(() => {\n setShowSettings(false);\n }, []);\n\n const value: ConsentContextValue = {\n hasUserConsented,\n consentState,\n showBanner,\n showSettings,\n acceptAll,\n rejectAll,\n savePreferences,\n openSettings,\n closeSettings,\n updateConsent,\n };\n\n return (\n <ConsentContext.Provider value={value}>\n {children}\n </ConsentContext.Provider>\n );\n}\n\nexport function useConsent() {\n const context = useContext(ConsentContext);\n if (!context) {\n throw new Error('useConsent must be used within a ConsentProvider');\n }\n return context;\n}\n\n// Export for external use\nexport { ConsentContext };","import React, { ReactNode } from 'react';\nimport { useConsent } from '@/contexts/ConsentContext';\n\nexport interface UnstyledConsentBannerProps {\n className?: string;\n children?: ReactNode;\n}\n\nexport const UnstyledConsentBanner: React.FC<UnstyledConsentBannerProps> = ({\n className,\n children,\n}) => {\n const { showBanner, acceptAll, rejectAll, openSettings } = useConsent();\n\n if (!showBanner) return null;\n\n return (\n <div className={className} role=\"region\" aria-label=\"Cookie consent\">\n {children || (\n <>\n <div>\n <h3>Cookie Consent</h3>\n <p>We use cookies to enhance your experience. By continuing to visit this site you agree to our use of cookies.</p>\n </div>\n <div>\n <button onClick={acceptAll} aria-label=\"Accept all cookies\">\n Accept All\n </button>\n <button onClick={rejectAll} aria-label=\"Reject non-essential cookies\">\n Reject All\n </button>\n <button onClick={openSettings} aria-label=\"Manage cookie preferences\">\n Manage Preferences\n </button>\n </div>\n </>\n )}\n </div>\n );\n};","import React, { ReactNode } from 'react';\nimport { useConsent } from '@/contexts/ConsentContext';\n\nexport interface UnstyledConsentSettingsProps {\n className?: string;\n children?: ReactNode;\n}\n\nconst cookieCategories = [\n {\n id: 'necessary',\n name: 'Necessary Cookies',\n description: 'These cookies are essential for the website to function properly.',\n disabled: true,\n },\n {\n id: 'analytics',\n name: 'Analytics Cookies',\n description: 'These cookies help us understand how visitors interact with our website.',\n disabled: false,\n },\n {\n id: 'marketing',\n name: 'Marketing Cookies',\n description: 'These cookies are used to track visitors across websites for marketing purposes.',\n disabled: false,\n },\n {\n id: 'functional',\n name: 'Functional Cookies',\n description: 'These cookies enable personalized features and functionality.',\n disabled: false,\n },\n];\n\nexport const UnstyledConsentSettings: React.FC<UnstyledConsentSettingsProps> = ({\n className,\n children,\n}) => {\n const { showSettings, consentState, updateConsent, savePreferences, closeSettings } = useConsent();\n\n if (!showSettings) return null;\n\n const handleSave = () => {\n savePreferences(consentState);\n };\n\n return (\n <div className={className} role=\"dialog\" aria-label=\"Cookie preferences\">\n {children || (\n <>\n <div>\n <h2>Cookie Preferences</h2>\n <p>Manage your cookie preferences. You can enable or disable different categories of cookies below.</p>\n </div>\n \n <div>\n {cookieCategories.map((category) => (\n <div key={category.id}>\n <div>\n <h4>{category.name}</h4>\n <p>{category.description}</p>\n </div>\n <input\n type=\"checkbox\"\n checked={consentState[category.id as keyof typeof consentState]}\n onChange={(e) => updateConsent(category.id as keyof typeof consentState, e.target.checked)}\n disabled={category.disabled}\n aria-label={`Toggle ${category.name}`}\n />\n </div>\n ))}\n </div>\n\n <div>\n <button onClick={closeSettings} aria-label=\"Cancel changes\">\n Cancel\n </button>\n <button onClick={handleSave} aria-label=\"Save cookie preferences\">\n Save Preferences\n </button>\n </div>\n </>\n )}\n </div>\n );\n};","import React from 'react';\nimport { useConsent } from '@/contexts/ConsentContext';\n\nexport interface UnstyledConsentToggleProps {\n category: 'analytics' | 'marketing' | 'functional';\n className?: string;\n label?: string;\n}\n\nexport const UnstyledConsentToggle: React.FC<UnstyledConsentToggleProps> = ({\n category,\n className,\n label,\n}) => {\n const { consentState, updateConsent } = useConsent();\n\n return (\n <label className={className}>\n <input\n type=\"checkbox\"\n checked={consentState[category]}\n onChange={(e) => updateConsent(category, e.target.checked)}\n aria-label={label || `Toggle ${category} cookies`}\n />\n {label && <span>{label}</span>}\n </label>\n );\n};"]}